@charset "utf-8";

/*
Theme Name: Palma テーマ
Version: 1.0
*/

/* -----------------------------------------------------
		目次
		
		/*		Common
		/*		header	
		/*		footer
        /*		fixed menu				
		/*		Top Page	
		/*		フォーム共通	(お問い合わせ・会員登録・購入画面)
		/*		下層ページ　共通
		/*		商品一覧ページ
		（以下各ページ）
		
----------------------------------------------------- */


/* -----------------------------------------------------
		全デバイス共通［common］		
----------------------------------------------------- */


/*		Common				
-----------------------------------------------------*/
body {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	color:#333;
	font-size: 62.5%;
	font-family: 'Open Sans','Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, 'メイリオ', sans-serif;
}
input, textarea, select, button {
    width: 100%;
    box-sizing: border-box;
    padding: 7px;
	color: inherit;
	font-size: inherit;
	font-family: inherit;
	border: none; /* buttonの線を消す */
    border: #ddd 1px solid;
	/* リセット */
	-webkit-appearance: none;
	-moz-appearance: none;
}

a {
	color: #333;
}
/*a:visited {
	color: #333;
}*/

img {
    max-width: 100%;
	vertical-align: bottom;
}

.pc_none {
	display: none; /* PCで非表示 */
}


/* --- clear fix --- */
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}
/* --- マウスオーバー --- */
.alpha a:hover {
  opacity: .7;
}
button {
	transition: all .3s;
}
button:hover {
	opacity: .7;
}


#wrapper {
	position: relative;
	width: 100%;
	min-width: 1000px; /*タブレット用はみだし防止*/
    overflow: hidden;
}
@media screen and (max-width: 599px) {
    #wrapper {
        min-width: 0;
        overflow: auto;
    }
}

/*		header				
-----------------------------------------------------*/
#header {
	margin:0 auto;
}
.header_logo {
    width: 105px;
    height: 104px;
    margin: 0 auto;
    padding: 10px 0;
}
.header_nav {
    position: relative;
    max-width: 1000px;
    margin: 0 auto;
    padding: 20px 0;
}
.g_nav {
    text-align: center;
}
.g_nav li {
    display: inline-block;
/*    margin: 0 30px;*/
}
.g_nav a {
    display: block;
    position: relative;
    padding: 20px 30px;
    font-size: 160%;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    letter-spacing: .1em;
}
.g_nav a:after {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2px;
    width: 70%;
    height: 2px;
    margin: auto;
    background: #fff;
    content: '';
}
.home .g_nav .nav_home a:after,
.menu .g_nav .nav_menu a:after,
.news .g_nav .nav_news a:after,
.contact .g_nav .nav_contact a:after,
.g_nav a:hover:after {
    background: #555;
}

/* SNS link */
.sns_link {
    position: absolute;
    right: 10px;
    top: 27px;
}
.sns_link li {
    display: inline-block;
    margin: 0 3px;
}
.sns_link li a {
    display: block;
    width: 40px;
    height: 40px;
    border: #ddd 1px solid;
    border-radius: 50%;
    box-sizing: border-box;
    text-indent: -9999px;
    overflow: hidden;
}
.sns_link li.insta a {
    background: url(image/icon_insta.png) no-repeat center center;
    background-size: auto 18px;
}
.sns_link li.fb a {
    background: url(image/icon_fb.png) no-repeat center center;
    background-size: auto 18px;
}
.sns_link li.line a {
    background: url(image/icon_line2.png) no-repeat center center;
    background-size: auto 20px;
}
.contact_btn {
    display: block;
    position: fixed;
    z-index: 2;
    right: 0;
    top: 40%;
    padding: 15px;
    width: 1em;
    background: #ea7711;
    color: #fff;
    font-size: 150%;
    font-weight: bold;
    webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    letter-spacing: .1em;
    text-decoration: none;
}
#panel-btn{
    display: none;
}
@media screen and (max-width: 599px) {
    .modal_wrap {
        display: none;
        position: absolute;
        top: 0;
        z-index: 5;
        width: 100%;
        height: 100vh;
        padding: 20px 0;
        background: rgba(0,0,0,.9);
    }
    .header_nav {
        
    }
    .header_nav .g_nav  {
        margin: 0 0 25px;
    }
    .g_nav li {
        display: block;
    }
    .g_nav a {
        color: #fff;
    }
    .g_nav a:after {
        display: none;
    }
    .header_nav .sns_link {
        position: static;
        text-align: center;
    }
    .header_nav .sns_link li {
        display: inline-block;
        margin: 0 7px;
    }
    .header_nav .sns_link li a {
        background-color: #fff;
    }
    
    .contact_btn {
        display: none;
    }
    
    /*ハンバーガー*/
	#panel-btn{
		display: inline-block;
		position: absolute;
		right: 0;
		top: 0;
        z-index: 100;
		width: 46px;
		height: 46px;
		background: #f3e5d9;
		cursor: pointer;
	}
	#panel-btn-icon{
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		width: 20px;
		height: 2px;
		margin: -1px 0 0 -10px;
		background: #222;
		transition: .2s;
	}
	#panel-btn-icon:before, #panel-btn-icon:after{
		display: block;
		content: "";
		position: absolute;
		top: 50%;
		left: 0;
		width: 20px;
		height: 2px;
		background: #222;
		transition: .3s;
	}
	#panel-btn-icon:before{
		margin-top: -6px;
	}
	#panel-btn-icon:after{
		margin-top: 4px;
	}
	#panel-btn .close{
		background: transparent;
	}
	#panel-btn .close:before, #panel-btn .close:after{
		margin-top: 0;
	}
	#panel-btn .close:before{
		transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
	}
	#panel-btn .close:after{
		transform: rotate(-135deg);
		-webkit-transform: rotate(-135deg);
	}
}

/*		main				
-----------------------------------------------------*/
.home #main {
    overflow: hidden;
}


/*		footer				
-----------------------------------------------------*/
#footer {
	background: #ecdecd url(image/footer_bg.png) repeat-y center 0;
	padding: 55px 0 25px;
}
.footer_in {
    max-width: 800px;
    margin: 0 auto;
}
.footer_info {
    float: left;
    width: 50%;
}
.footer_logo {
    float: left;
    margin: 0 20px 20px 0;
}
.footer_name {
    margin: 0 0 10px;
    font-size: 140%;
    line-height: 1.6;
    letter-spacing: 0.05em;
}
.footer_name span {
    font-size: 126.7%;
    font-weight: bold;
}
.footer_info .address,
.footer_info .open,
.footer_info .close {
    font-size: 150%;
    line-height: 1.7;
}
.footer_info .paypay {
    margin: 15px 0 0 125px;
    /*padding: 5px 0 5px 65px;*/
    padding: 5px 0 5px 0;
    /*background: url(image/logo_paypay.png) no-repeat 0 center;*/
    background-size:60px auto; 
    font-size: 110%; 
}

.footer_info .sns_link {
    display: none;
}
@media screen and (max-width: 599px) {
    .footer_info .sns_link {
        display: block;
        position: static;
        margin: 15px 0 0;
    }
    .footer_info .sns_link li a {
        border: #aaa 1px solid;
    }
    .footer_info .sns_link li.insta a {
        background: #fff url(image/icon_insta.png) no-repeat center center;
        background-size: auto 18px;
    }
    .footer_info .sns_link li.fb a {
        background: #fff url(image/icon_fb.png) no-repeat center center;
        background-size: auto 18px;
    }
    .footer_info .sns_link li.line a {
        background: #fff url(image/icon_line2.png) no-repeat center center;
        background-size: auto 20px;
    }
}



.footer_contact {
    float: right;
}
.footer_contact .ttl {
    margin: 0 0 5px;
    font-size: 140%;
}
.footer_contact .tel {
    display: block;
    margin: 0 0 10px;
    padding: 4px 0 4px 35px;
    background: url(image/icon_tel.png) no-repeat 0 center;
    background-size: 25px;
    font-size: 260%;
    font-weight: bold;
    font-family: 'Avenir', 'Open Sans', sans-serif;
    text-decoration: none;
}
.footer_contact .reserve {
    margin: 0 0 10px;
}
.footer_contact .reserve a {
    display: block;
    padding: 8px 0 8px 35px;
    text-decoration: none;
    font-size: 150%;
    font-weight: bold;
}
.footer_contact .reserve a.web {
    background: url(image/icon_reserve_or.png) no-repeat 0 center; 
    background-size: 25px;
}
.footer_contact .reserve a.line {
    background: url(image/icon_line_gr.png) no-repeat 0 center; 
    background-size: 25px;
    
}
.footer_contact .link_btn_wrap {
    margin: 0;
}
.copyright {
    margin: 40px 0 0;
    font-size: 110%;
    text-align: center;
}
@media screen and (max-width: 599px) {
    #footer {
        padding: 25px 0;
    }
    .footer_in {
        padding: 0 2%;
        box-sizing: border-box;
    }
    .footer_info {
        float: none;
        width: 100%;
        margin: 0 0 25px;
        text-align: center;
    }
    .footer_info .paypay {
        display: inline-block;
        margin: 15px 0 0;
    }
    .footer_logo {
        display: block;
        width: 80px;
        height: auto;
        float: none;
        margin: 0 auto 10px;
    }
    .footer_contact {
        float: none;
        text-align: center;
        border-top: #999 1px dashed;
        padding-top: 30px;
    }
    .footer_contact .tel {
        display: inline-block;
    }
    .footer_contact .reserve {
        margin: 0 0 20px;
    }
    .footer_contact .reserve a {
        display: inline-block;
        margin: 0 10px;
        font-size: 130%;
    }
    .footer_contact .link_btn_wrap {
        margin: 0 auto;
    }
    .copyright {
        margin: 25px 0 45px;
        padding: 0 2%;
        line-height: 1.3;
    }
}



/*		fixed menu				
-----------------------------------------------------*/
.fixed_menu {
    display: block;
    position: fixed;
    z-index: 2;
    right: 0;
    top: 35%;
}
.fixed_menu ul li {
    width: 1em;
    /*webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;*/
    writing-mode: vertical-rl;
    letter-spacing: .1em;
    }
.fixed_menu ul a {
    display: block;
    padding: 15px;
    border: #fff 1px solid;
    background: #f3e5d9;
    font-size: 140%;
    text-decoration: none;
    text-align: center;
}
.fixed_menu ul a .far {
    margin: 0 0 10px;
    font-size: 130%;
    color: #ea7711;
}
@media screen and (max-width:599px) {
    .fixed_menu {
        top: auto;
        right: auto;
        bottom: 0;
        width: 100%;
    }
    .fixed_menu ul {
        display: flex;
        border: #fff 1px solid;
    }
    .fixed_menu ul li {
        width: 50%;
        /*webkit-writing-mode: auto;
        -ms-writing-mode: auto;*/
        writing-mode: unset;
        letter-spacing: 0;
    }
    .fixed_menu ul a .far {
        margin: 0 10px 0 0;
        vertical-align: middle;
    }
    .fixed_menu ul a .far:before {
        vertical-align: middle;
    }
}



/*		コンテンツページ　共通			
-----------------------------------------------------*/
.page_ttl {
    padding: 40px 1em;
    font-size: 300%;
    font-weight: bold;
    font-family: 'Avenir', 'Open Sans', sans-serif;
    letter-spacing: .06em;
    text-align: center;
}
.page_image {
    margin: 0 0 40px;
    /*height: 300px;*/
    height: 400px;
    /*background: url(image/ttl_bg.jpg) no-repeat center center fixed;*/
    background: url(image/main_image02.jpg) no-repeat center center;
    /*background-size: cover;*/
    background-size: auto 100%;
}
@media screen and (max-width: 599px) {
    .page_image {
        /*height: 200px;*/
        height: 130px;
        background-attachment: scroll;
    }
}
.contents article {
    padding: 0 0 40px;
}
.contents h2 {
	margin: 60px auto 40px;
	padding: 15px 0;
    border-top: solid 2px #ac9786;
	border-bottom: solid 2px #ac9786;
	font-size: 220%;
    line-height: 1.5;
	color:#333;
	letter-spacing: 0.1em;
    text-align: center;
}
@media screen and (max-width: 599px) {
    .contents h2 {
	   margin: 30px auto 20px;
    }
}
.contents h3 {
    margin: 40px auto 10px;
    font-size: 180%;
    line-height: 1.5;
}
.contents p {
	margin: 0 0 25px;
    font-size: 150%;
	line-height: 1.5;
}
.contents table {
	margin: 0 0 25px;
}
.contents table th,
.contents table td {
    padding: 20px 15px;
    border-top: dashed 1px #ac9786;
    border-bottom: dashed 1px #ac9786;
    font-size: 150%;
	line-height: 1.5;
    vertical-align: middle;
    text-align: left;
}
@media screen and (max-width: 599px) {
    .contents table th,
    .contents table td {
        padding: 15px 5px;

    }
}
.contents table tr:first-child th, .contents table tr:first-child td {
    border-top: none;
}
.contents table th {
/*	background: #f2e8e1;*/
}
.contents table td {
	text-align: right;
}
.contents dt,
.contents dd {
    font-size: 150%;
    line-height: 1.5;
}



/* リンクボタン */
.link_btn_wrap { /* 枠あり */
	width: 200px;
    margin: 0 auto 25px;
	border: #ac9786 2px solid;
	box-sizing: border-box;
}
.link_btn_wrap p {
	padding: 1px;
    
    margin: 0;
    font-size: inherit;
}
.link_btn {
    display: block;
	position: relative;
    width: 100%;
	margin: 0;
	padding: 12px 1em;
	background: #ac9786;
	font-size: 150%;
	text-decoration: none;
	text-align: center;
	color: #fff;
	box-sizing: border-box;
	transition: .2s;
}
.link_btn:hover {
	background: #fff;
    color: #887668;
}

/* Layout */
.inner {
	max-width: 1000px;
/*	width: 100%;*/
	margin: 0 auto;
	box-sizing: border-box;
}
@media screen and (max-width: 599px) {
    .inner {
        padding: 0 2%;
    }
}
.fl_left {
	float: left;
}
.fl_right {
	float: right;
}
.w50 {
	width: 48%;
}
.w70 {
    width: 70%;
    margin: 0 auto;
}
@media screen and (max-width: 599px) {
    .w70 {
        width: 100%;
    }
}
.strong {
    font-weight: bold;
}
.left {
	text-align: left;
}
.center {
	text-align:center;
}
.right {
	text-align:right;
}
.table {
	display:table;
}
.table_cell {
	display: table-cell;
	vertical-align: middle;
}
/* 横幅48% 左右に並べる */
.column2 .col_left {
	float: left;
	width: 48%;
	margin: 0 0 25px;
}
.column2 .col_right {
	float: right;
	width: 48%;
	margin: 0 0 25px;
}
.column2 .col_left img,
.column2 .col_right img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 0 10px
}

/* Text */
strong {
	font-weight: bold;
}
.txt_bl {
	color:#4197c1;
}
.txt_red {
	color:#c33;
}
.txt_s {
	font-size: 80%;
}
.txt_l {
	font-size: 150%;
}
.no_wrap {
	word-break: keep-all;
}
.underline {
	text-decoration:underline;
}


/*		Top Page			
-----------------------------------------------------*/
/* トップ共通 */
.top_section {
    max-width: 1000px;
    padding: 50px 0;
    margin: 0 auto;
    border-bottom: #e4d4c7 1px solid;
}
.top_section:last-child {
    border-bottom: none;
}
.top_section h2 {
    margin: 0 0 40px;
    text-align: center;
}
@media screen and (max-width: 599px) {
    .top_section h2 {
        margin: 0 0 20px;
    }
}
.top_section h2 .jpn {
    display: block;
}
@media screen and (max-width: 599px) {
    .top_section {
        padding: 30px 2%;
        box-sizing: border-box;
    }
}

/* メインイメージ */
.main_image {
    max-width: 1500px;
    margin: 0 auto 30px;
}
@media screen and (max-width: 599px) {
    .main_image {
        /*width: 150%;*/
        width: 100%;
    }
}

/* top news */
.news_list {
    max-width: 670px;
    margin: 0 auto 30px;
}
.news_list dt,
.news_list dd {
    font-size: 150%;
    line-height: 1.7;
}
.news_list dt {
    float: left;
    width: 8em;
    font-weight: bold;  
}
.news_list dd {
    margin: 0 0 15px;
    padding: 0 0 0 8em;
}
.news_list dd a:hover {
    text-decoration: none;
}
@media screen and (max-width: 599px) {
    .news_list dt {
        float: none;
        width: 100%;
    }
    .news_list dd {
        padding: 0;
    }
}

/* top menu */
.top_menu .menu_list {
    display: flex;
    justify-content: space-between;
}
.top_menu .menu_list a {
    display: block;
    position: relative;
    width: 483px;
    height: 334px;
    /* 3列の時 */
    /*width: 32%;*/
    /*height: 250px;*/
}
.top_menu .menu_list a:before {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    content: '';
    transition: .3s;
}
.top_menu .menu_list a.menu_eyelash:before {
    background: rgba(233,242,227,.8)
}
.top_menu .menu_list a.menu_healing:before {
    background: rgba(248,235,225,.85);
}
.top_menu .menu_list a.menu_hair:before {
    background: rgba(239,237,209,.85);
}
.top_menu .menu_list a.menu_eyelash:hover:before {
    background: rgba(233,242,227,1);
}
.top_menu .menu_list a.menu_healing:hover:before {
    background: rgba(248,235,225,1);
}
.top_menu .menu_list a.menu_hair:hover:before {
    background: rgba(239,237,209,1);
}
.top_menu .menu_list a:after {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    /*width: 463px;
    height: 314px;*/
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    content: '';
    margin: auto;
    border: #fff 3px solid;
    box-sizing: border-box;
}

.top_menu .menu_eyelash {
    background: url(image/menu_bg_eyelash.jpg) no-repeat 0 0;
    background-size: 135%;
    /*background-size: cover;*/
}
.top_menu .menu_healing {
/*    float: left;*/
    background: url(image/menu_bg_massage.jpg) no-repeat 0 0;
    background-size: cover;
}
.top_menu .menu_hair {
/*    float: right;*/
    background: url(image/menu_bg_hair.jpg) no-repeat 0 0;
    background-size: cover;
}
.top_menu h3 {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 1;
    text-align: center;
    transform: translateY(-50%);
}
@media screen and (max-width: 599px) {
    .top_menu .menu_list {
        display: block;
    }
    .top_menu .menu_list a {
        width: 100%;
        height: 200px;
        margin: 0 0 15px;
        background-size: cover;
    }
    .top_menu .menu_list a:after {
        width: 97%;
        height: 190px;
        border: #fff 3px solid;
    }
    .top_menu .menu_healing {
        float: none;
    }
    .top_menu .menu_hair {
        float: none;
    }
}

/* access */
.top_access .txt_area p,
.top_access .txt_area dl{
    font-size: 170%;
    line-height: 1.7;
}
.top_access .txt_area p {
    margin: 0 0 20px;
    padding: 0 0 18px;
    border-bottom: #cbb59a 2px dashed;
}
.top_access .txt_area p a {
    text-decoration: none;
}
.top_access .txt_area dt {
    font-weight: bold;
    float: left;
}
@media screen and (max-width: 599px) {
    .top_access .col_left,
    .top_access .col_right {
        float: none;
        width: 100%;
    }
    .top_access .col_right iframe {
        width: 100%;
        height: 200px;
    }
}



/*		MENU			
-----------------------------------------------------*/
.page.menu .menu_image {
    display: block;
    margin: 0 auto 25px;
}
.page.menu table {
    width: 100%;
}

.spcl_box th {
    width: 50%;
    background: #fcf5f0;
}
.spcl_box .plice {
    font-size: 120%;
    font-weight: bold;
    color: rgba(204, 67, 67, 0.99);
}
@media screen and (max-width: 599px) {
    .spcl_box table,
    .spcl_box thead,
    .spcl_box tbody,
    .spcl_box tr,
    .spcl_box th,
    .spcl_box td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    .spcl_box table td{
        border: none;
    }
}
/* キャンペーンエリア */
.campaign {
    border: #ea7711 1px solid; 
    margin: 0 auto 25px;
}
.campaign .mds {
    margin: 0 0 25px; 
    padding: 10px; 
    background: #ea7711; 
    font-size: 170%; 
    color: #fff; 
    text-align: center;
}
.campaign p.price {
    line-height: 2;
    text-align: center;
}
.line_b:after {
    display: block;
    content: '';
    width: 35%;
    height: 1px;
    margin: 25px auto 0;
    border-bottom: dashed 1px #ac9786;
}


/*		CONTACT			
-----------------------------------------------------*/
.page.contact .tel_box a {
    display: block;
    width: 100%;
    padding: 15px;
    background: #222 url(image/icon_tel2.png) no-repeat 15px center;
    background-size: 20px auto;
    box-sizing: border-box;
    color: #fff;
    text-decoration: none;
    text-align: center;
    font-size: 115%;
}
.mail_form dl dt,
.mail_form dl dd {
    font-size: 150%;
    line-height: 1.5;
}
.mail_form dl dt {
    margin: 0 0 10px;
}
.mail_form dl dt span {
    margin: 0 0 0 10px;
    color: #c33;
}
.mail_form dl dd {
    margin: 0 0 25px;
    padding: 7px 0;
}


/*		NEWS(一覧ページ)			
-----------------------------------------------------*/
.news_item {
    margin: 0 auto 60px;
    padding: 0 0 50px;
    border-bottom: #e2d6cc 1px solid;
}
@media screen and (max-width: 599px) {
    .news_item {
        margin: 0 auto 20px;
        padding: 0 0 20px;
    }
}
.news_date {
    float: left;
    width: 15%;
    padding: 10px 0;
    font-weight: bold;  
}
@media screen and (max-width: 599px) {
    .contents .news_date {
        float: none;
        width: 100%;
        margin: 0;
    }
}
.news_right {
    padding: 0 0 0 18%;
}
@media screen and (max-width: 599px) {
    .news_right {
        padding: 0;
    }
}
.contents .news_ttl {
    margin: 0 auto 30px;
    padding: 8px 15px;
    border: none;
    background: #f7f5f5;
    text-align: left;
}
/*.news_contents {
    font-size: 150%;
}*/



/* -----------------------------------------------------
		タブレット専用［640px以上　959px以下］				
----------------------------------------------------- */
@media screen and (max-width: 959px) {
		

	
}

/* -----------------------------------------------------
		Mobile専用 599px以下				
----------------------------------------------------- */
@media screen and (max-width: 599px) {
	.pc_none {
		display: block; /* PCで非表示 */
	}
	.sp_none {
		display: none; /* SPで非表示 */
	}

	

}

/* -----------------------------------------------------
		Print 			
----------------------------------------------------- */
@media print {
#wrapper{
	width:100%;
	margin: 0 auto;
	overflow:visible;
}
}