@charset "UTF-8";
.pc,
.no-sp,
.middle-large{
	display: none;
}
body{
	font-size: 16px;
	border-top: 5px solid #3E3A39;
	background: #fefaf4;
}

/*リンク文字*/
a{ text-decoration: underline; }
a:link{ color: #b3b3b3; }
a:visited{ color: #a09a9d; }
a:hover{ color: #38bbff; }
a:active{ color: #c60; }

/*説明文字*/
.setumei{
	font-size: 14px;
}

p{
	word-break: normal;
	-ms-word-break: normal; /* IE用 */
	text-align: justify;
	text-justify: inter-ideograph;
	line-height: 2em;
}
/*----------------------

header

------------------------*/

#header-logo {
	padding: 20px 0 0;
}
#header-logo a{
	float: left;
	width: 50%;
	max-width: 148px;
}
#header-logo img{
	width: 100%;
	height: auto;
}
#header-logo a + img {
    max-width: 299px;
    margin: -1px 0 0 21px;
}
#btn-contact{
	text-align: center;
	margin: 10px 0;
}
#camera_wrap_test {
    float: none;
}
#pickup p {
    text-align: center;
    margin: 5px;
}

.menubtn{
    background: #3E3A39;
    position: absolute;
    top: 18px;
    right: 10px;
    height: 40px;
    width: 40px;
    display: block;
    border-radius: 3px;
    padding: 5px;
}
nav{
	display: none;
	background: #574a3f;
	position: absolute;
	top: 79px;
	right: 0;
	width: 100%;
	text-align: center;
}
nav li{
	width: calc(50% - 1px);
	float: left;
	border-left:  1px solid  #726356;
	list-style-type: none;
}
nav a{
	padding: 10px 0;
	display: block;
	color: #fef6e9!important;
	text-decoration: none;
	border-bottom:  1px solid  #726356;
}

nav img{
	display: none;
}
/*

content

*/
#wrap{
	background: #fefaf4;
	padding-bottom: 30px;
	margin-bottom: 30px;
}
#breadcrumbs{
	padding: 10px 3% 40px;
	font-size: 0.8em;
}
#breadcrumbs li{
	float: left;
	padding-right: 10px;
	padding-left: 15px;
	background: url(images/icon/icon-breadcrumbs.gif) left 10px no-repeat;
	font-size: 1em;
}
#main-contents h2.h3, #main-contents h3 {
    font-family: serif, "ＭＳ Ｐ明朝", "細明朝体", "ヒラギノ明朝 Pro W3";
    clear: both;
    margin-bottom: 14px;
    padding: 5px 10px 5px 20px;
    border: 1px solid #bfb7ac;
    font-size: 1.2em;
    background-image: url(images/webtreats_baby_pink_pattern_21.jpg);
    background-repeat: repeat-x;
    background-position: left top;
    color: #736357;
}
#main-contents h1, #main-contents h2 {
    margin-top: 20px;
    padding-top: 18px;
    padding-left: 22px;
    padding-right: 22px;
    height: 41px;
    color: #836f46;
    clear: both;
    margin-bottom: 20px;
    background: url(images/menupage1_08.jpg) left top repeat-y;
    border-bottom: #aaa;
    font-size: 1.2em;
    line-height: 1.0;
}
#main-contents h4 {
    border-bottom-width: 3px;
    clear: both;
    margin: 15px 0 5px;
    margin-bottom: 14px;
    border-bottom: double #999;
    /* font-size: 0.858em; */
    font-weight: bold;
}

/*パン屑ナビの先頭*/
#breadcrumbs li.first{
	padding-left: 0;
	background: none;
}
.main-image{
	margin-bottom: 20px;
}
#main-contents img {
    width: 100%;
    height: auto;
}
#main-contents {
    padding: 0 5% 30px;
}

ul.social-button{
	margin: 40px 0 0px;
	overflow: hidden;
}
ul.social-button li {
    list-style-type: none;
    float: left;
    margin: 0 10px 0 0;
}
#sidebar {
    width: 100%;
    text-align: center;
    margin: 40px 0;
}
#main-contents h4.top-newtitle{
	border: none;
	margin-bottom: 0;
    padding-bottom: 0;
}
/*----------------------

footer

------------------------*/
#footer img{
	width: 100%;
}
#page-top {
    overflow: hidden;
    height: 28px;
}

div#page-top {}
#page-top a {
    float: right;
    display: block;
    width: 166px;
}
#page-top a img{
	width: 100%;
}
#footer {
    height: auto;
    background-color: #383735;
    color: #AAAAAB;
    padding: 20px 5%;
}
#footer-nav{
	margin: 20px 0;
}
.footer-menu:nth-child(odd){
	width: calc(55% - 10px);
	margin-right: 10px;
	float: left;
}
.footer-menu:nth-child(even){
	width: 45%;
	float: left;
}
.footer-menu dt {
    color: white;
    margin: 20px 0 0 0;
}
.profil{
	margin: 20px 0;
}
.map{
	clear: both;
	margin: 20px 0 20px;
}
.map p {
    margin: 10px 0;
    text-align: center;
}
.banner_mini {
    margin: 30px auto;
    text-align: center;
    clear: both;
	margin: 20px 0;
}
.banner_mini p{
	text-align: center;
}
.banner_mini a img{
	width: 100%;
}
.banner_mini p:nth-of-type(1),
.banner_mini p:nth-of-type(2){
	margin: 0 0 5px 0;
	width: 100%;
}
.banner_mini p:nth-of-type(3),
.banner_mini p:nth-of-type(5){
	width: 49.5%;
	float: left;
	margin: 0px 1% 5px 0;
}
.banner_mini p:nth-of-type(4),
.banner_mini p:nth-of-type(6){
	width: 49.5%;
	float: left;
	margin: 0px 0 5px 0;
}
/*#footer-in {
   display: flex;           /* flexコンテナ化 */
   flex-direction: column; /* 縦向きに配置 */
}*/
.profil { 
	order: 4;
}
.map {
	order: 1;
	margin: 20px 0;
}
#footer-nav{
	order: 2;
	overflow: hidden;
}
.banner_mini{
	order: 5;
	overflow: hidden;
}
.spec{ 
	order: 3 ;
	margin: 20px 0;
}
.copyright{
	order: 6 ;
	margin: 20px 0;
}
/*--------------

page

-----------------*/
#home #main-contents img{
	margin: 0 0 20px 0;
}
#home #main-contents iframe{
	width: 100%;
}
#icatch3 {
    height: 100px;
    width: 100%;
    background: url(images/conceptpage_05.jpg) no-repeat;
    background-position: center;
    background-size: cover;
    clear: both;
}
#icatch2 {
    height: 121px;
    background-image: url(images/1207cam_05.jpg);
    background-repeat: no-repeat;
    background-position: center;
    clear: both;
}


#icatch3 {
    height: 100px;
    width: 100%;
    background: url(images/conceptpage_05.jpg) no-repeat;
    background-position: center;
    background-size: cover;
    clear: both;
}
#icatch4 img{
	width: 100%;
}
#icatch5{ 
    height: 100px;
    width: 100%;
	background-image: url(images/catch_access1.jpg);
    background-position: center;
    background-size: cover;
    clear: both;
}
#icatch6{ 
    height: 100px;
    width: 100%;
	background-image: url(images/catch_make.jpg);
    background-position: center;
    background-size: cover;
    clear: both;
}

#icatch7{ 
	height: 419px;
	background-image: url(images/img_blog2_05.jpg);
    background-position: center;
    background-size: cover;
    clear: both;
}
/*

メイク

*/
#make2 .menu-content {
    overflow: hidden;
    margin: 20px 0;
    border-bottom: 1px solid #ccc;
    padding: 0 0 20px;
}
#main-contents h5 {
    color: #836f46;
    border-bottom: #aaa;
    font-size: 1.4em;
    line-height: 1;
    padding-bottom: 5px;
}
/*

フェイシャルメニュー

*/
p.setumei3 img {
    width: auto!important;
    height: 18px!important;
}
#happymake ul#tab_menu {
    overflow: hidden;
    margin: 20px 0;
}
/*

ハッピーメイク

*/
#panel {
  width: calc(100% - 20px);
  margin: 30px auto;
  background: #fff;
  padding: 10px;
} 
#panel > dt {
  cursor: pointer;
} 
#panel > dd {
  margin: 0px;
  padding: 15px;
  background: #fff;
  font-size: 0.9em;
}
#happymake table{
	width: 100%;
}
#happymake table tr th,
#happymake table tr td{
	display: block;
	padding: 0 0 30px;
}
#happymake td img{
	width: 80%;
	display: block;
	margin: 0 auto;
}
#happymake .prof img{
	width: 70%;
	text-align: center!important;
}
#happymake .prof dl{
	clear: both;
	margin: 20px 0 0;
}
#happymake .prof dl dt {
    padding-left: 10px;
    background-color: #bfb7ac;
    color: #FFFBF2;
}
#happymake-koushi figure{
	text-align: center;
	overflow: hidden;
	margin: 20px auto 0;
}
.jyukosya {
	margin: 30px 0;
}
#jyukosya figure {
	text-align: center;
}
#jyukosya figure img{
	width: 70%;
	margin: 0 auto;
}
/*

プロフィール

*/
.contents4 pre {
    color: #736b5f;
    text-align: left;
    font-family: "ＭＳ Ｐ明朝", 細明朝体, "ヒラギノ明朝 Pro W3";
    margin: 20px 0;
}
/*

ブライダルエステ

*/
#bridal #main-contents p.setumei3 a{
	margin: 30px auto;
	text-align: center;
	display: block;
}
#bridal #main-contents p.setumei3 a img{
	width: 100%!important;
	max-width: 322px;
	height: auto!important;
}
/*

リンク

*/
#link #main-contents ul li{
	list-style-type: none;
}
/*

店舗情報

*/
@media screen and (min-width:701px){
#access figure{
	float: left;
	width: 50%;
	text-align: center;
	margin: 0 auto;
}
#access figure + p.main-point3{
	width: calc(50% - 30px);
	float: right;
	padding: 60px 10px 40px;
	text-align: left;
	font-size: 70%;
	height: auto;
	margin: 0px auto;
	background: url(https://www.sion-karasuma.com/wp-content/themes/sion/images/img_point3.png) no-repeat,#fff;
	background-size: 100%;
}
}
@media screen and (max-width:700px){
#access figure{
	width: 70%;
	text-align: center;
	margin: 0 auto;
}
#access figure + p.main-point3{
	width: 70%;
	padding: 60px 10px 10px;
	text-align: left;
	font-size: 70%;
	height: auto;
	margin: 20px auto;
	background: url(https://www.sion-karasuma.com/wp-content/themes/sion/images/img_point3.png) no-repeat,#fff;
	background-size: 100%;
}
}
#access-map{
	clear: both;
	float: none!important;
	width: 100%!important;
}
#googlemap iframe{
	width: 100%!important;
  height: 500px;
}

/*
ボディトリートメント
*/

#body1{
	text-align: center;
}
#body1 figure,
#body2 figure,
#body3 figure{
	width: 70%;
	margin: 0 auto;
	overflow: hidden;
}
#body1 p{
	text-align: center;
}
#body2 ul,
#body3 ul{
	overflow: hidden;
	margin: 5px 0 20px;
}
#body2 ul li,
#body3 ul li{
	float: left;
	list-style-type: none;
}
#body2 .contents-menu,
#body3 .contents-menu{
	padding: 30px 0;
	border-bottom: 1px solid #ccc;
}
#body2 .contents-menu:last-child,
#body3 .contents-menu:last-child{
	border-bottom: none;
}
#body2 .contents-menu h5,
#body3 .contents-menu h5{
	padding: 10px 0 0 0;
}
#body2 .contents-menu h5 span,
#body3 .contents-menu h5 span{
	font-size: 0.8em;
	margin-bottom: 20px;
	display: block;
}
#body4 figure{
	width: 70%;
	margin: 0 auto;
	overflow: hidden;
	text-align: center;
}
#body .body-arrow{
	text-align: center;
}
/*
スタッフ紹介
*/
#stuff #main-contents .left {
	width: 50%;
	margin: 0 auto 20px!important;
	float: none;
}
#stuff #main-contents .left img{
	margin: 0 auto;
}
.stuff dl {
	width: 100%;
}
.stuff dl dt {
	padding-left: 10px;
	background-color: #bfb7ac;
	color: #FFFBF2;
}
/*

初めての方へ

*/
#first #main-contents .firsttab p img{
	width: 100%!important;
	height: auto!important;
	max-width: 268px;
}
#first #main-contents h2.resp-accordion,
#first #main-contents h2.resp-tab-active{
	background: none!important;
	border: none!important;
	padding: 10px!important;
}
.resp-tabs-container {
    padding: 0px;
    background: none;
    clear: left;
}
.resp-tab-content{
	background: #fff;
	border: none;
}
.resp-tabs-container p img{
	float: none;
	text-align: center;
	margin: 10px auto;
	display: block;
}

/*

画像ギャラリー

*/
.post_info li {
    display: inline;
    list-style-type: none;
}
#gallery-1 .gallery-item {
    float: left;
    margin: 10px 5px;
    text-align: center;
    width: calc(25% - 10px)!important;
}
#gallery-1 .gallery-caption {
    margin-left: 0;
    font-size: 0.8em;
    line-height: 1.2em;
    margin-top: 5px;
}
/*

お問合せフォーム

*/
#contact #main input[type=text],
#contact #main input[type=email],
#contact #main textarea {
    width: calc(100% - 10px);
    font-size: 1.4em;
    padding: 5px;
}
#contact #main form p {
    margin: 10px 0 0 0;
}
/*

予約フォーム

*/
body#temporaryform #main form table{
    width: 100%!important;
    font-size: 1.2em;
}
body#temporaryform #main form h5{
	color: #000!important;
	padding: 0;
	margin: 30px 0 0 0;
	font-weight:bold;
	font-size: 22px;
}
body#temporaryform #main form h5 span{
	color: red;
	margin-left: 10px;
	font-weight: normal;
}
body#temporaryform #main form h5 + p{
	margin: 5px 0 0 0;
}
body#temporaryform #main form .yoyakucontent1:nth-of-type(1) input,
body#temporaryform #main form .yoyakucontent1:nth-of-type(2) select,
body#temporaryform #main form .yoyakucontent1:nth-of-type(3) input,
body#temporaryform #main form textarea {
    width: calc(100% - 12px);
    padding: 5px;
    font-size: 1.2em;
}
body#temporaryform #main form .yoyakucontent1:nth-of-type(4) input{
    padding: 5px;
    width: 60px;
    margin: 0;
}
body#temporaryform #main form .yoyakucontent1:nth-of-type(5) select{
    padding: 5px;
}
body#temporaryform #main form .yoyakucontent1:nth-of-type(6) select,
body#temporaryform #main form .yoyakucontent1:nth-of-type(6) input{
    width: calc(100% - 12px);
    padding: 5px;
}
button.sp.sp-btn {
    background: none;
    border: none;
    width: 100%;
    margin: 50px 0 10px;
}
button.sp.sp-btn a{
    background: none;
    border: none;
    width: 80%;
    text-decoration: none;
    color: #fff;
    background: #90734a;
    width: 80%;
    padding: 20px 0px;
    border-radius: 5px;
    font-size: 1.6em;
    font-weight: bold;
    display: block;
    margin: 0 auto;
}
form input[type="submit"]{
	background: none;
    border: none;
    width: 80%;
    text-decoration: none;
    color: #fff;
    background: #90734a;
    width: 60%;
    padding: 10px 0px;
    border-radius: 5px;
    font-size: 1.2em;
    font-weight: bold;
    display: block;
    margin: 30px auto;
}
/*

予約フォーム2

*/
#makeform2 #main form table{
    width: 100%!important;
    font-size: 1.2em;
}
#makeform2 #main form h5{
	color: #000!important;
	padding: 0;
	margin: 30px 0 0 0;
	font-weight:bold;
	font-size: 22px;
}
#makeform2 #main form h5 span{
	color: red;
	margin-left: 10px;
	font-weight: normal;
}
#makeform2 #main form h5 + p{
	margin: 5px 0 0 0;
}
#makeform2 #main form .yoyakucontent1:nth-of-type(1) input,
#makeform2 #main form .yoyakucontent1:nth-of-type(2) select,
#makeform2 #main form .yoyakucontent1:nth-of-type(3) input,
#makeform2 #main form textarea {
    width: calc(100% - 12px);
    padding: 5px;
    font-size: 1.2em;
}
#makeform2 #main form .yoyakucontent1:nth-of-type(4) input{
    padding: 5px;
    width: 60px;
    margin: 0;
}
#makeform2 #main form .yoyakucontent1:nth-of-type(5) select{
    padding: 5px;
}
#makeform2 #main form .yoyakucontent1:nth-of-type(6) select,
#makeform2 #main form .yoyakucontent1:nth-of-type(6) input{
    width: calc(100% - 12px);
    padding: 5px;
}