@charset "utf-8";

/* base ------------------------*/
#wrapper { position:relative; }
article>section { padding: 35px 0; }
.inner { width: 74%; margin:0 auto; }

/* loading */
#loading { position:fixed; top:0; z-index:9999; width:100%; height:100%;
background:#FCEAD9; }

.bg_loading { position:fixed; width:100%; height:100%; }
.bg_loading:before,
.bg_loading:after { position: fixed; content: ""; width: 100%; height: 100%; }

#loading .loading_con { display: none; position:absolute; top:0; left:0; right:0; bottom:0;
width:473px; height:150px; margin:auto; text-align:center; }


/*枠線*/
.fix{ width:100%; height:0; position: fixed; z-index: 10000;  }
.fix span { position: absolute; background:#fd4a32; font-size: 0;}
.fix span:nth-child(1) { top: 0; left: 0; }/*上*/
.fix span:nth-child(2) { top: 0; left: 0; }/*左*/
/*.fix span:nth-child(3) { top: 100vh; left: 0; margin-top: -7px;  }下*/
.fix span:nth-child(4) { top: 0; right: 0; }/*右*/
.fix span:nth-child(1),
.fix span:nth-child(3) { height:17px; width:100vw;  }
.fix span:nth-child(2),
.fix span:nth-child(4) { width: 17px; height: 100vh; }

.slick-slider * { outline: none!important; }

/* header ------------------------*/
#header { z-index: 999; position: fixed; padding: 3% 17px 0 3%; top: 0; left: 0; right: 0; width: 100%; }
#header #hnav .sitename { width: min(24%,208px); }
.h_info { float: left; padding-left: 30px; margin-left: 40px; line-height: 1; color: #3d2020; border-left: 1px dashed rgba(255, 255, 255, .6); }

/*scrollで非表示*/
#header #hnav { opacity: 1; }
#header #hnav.scroll { opacity: 0; -webkit-transition:all .3s; transition:all .3s; }

/*言語ボタン*/
#hnav { align-items: center; }
#hnav .langBox { position: absolute; top: 17px; right: 14.5%; width: 25%; padding: 1em 0; background: rgba(255,255,255,.8); }
#hnav .langBox .ttl { width: 23%; padding-top: 12px; font-family: fot-tsukuardgothic-std, sans-serif; font-weight: 700; text-align: center; position: relative; }
#hnav .langBox .ttl::before { content: ""; position: absolute; top: 0; right: 0; left: 0; width: 18px; height: 18px; margin: 0 auto; background: url(/img/ico-lang.svg) no-repeat center / 100%; }

#hnav .langBtn { flex: 1; margin-right: 1em; align-items: center; }
#hnav .langBtn li { width: 48%; }
#hnav .langBtn li.ch a { background-color: #c67cbe; }
#hnav .langBtn li.jp a { background-color: #efa627; }
#hnav .langBtn li a { display: block; padding: .2em 0; font-family: fot-tsukuardgothic-std, sans-serif; font-weight: 700; color: #fff; text-align: center; background: #66c1b5; border-radius: 50px; }


.tel { margin: 0; padding-left: .8em; font-size: min(3.6vw,40px); font-weight: 500; background: url("../img/tel.svg") no-repeat top 5px left /20px; }
.tel a { color: #3d2020; }

.hour { margin: 0; padding-left: 20px; background: url("../img/clock.svg") no-repeat top left /14px; font-size: min(2.5vw,20px); font-weight: 400; }

.mail { margin: 0; padding-left: 22px; background: url(../img/mail.svg) no-repeat top 2px left /15px; font-size: 1.285em; font-weight: 400; }
.mail>* { color: #3b0f0f; }

/* gnav ------------------------*/
/*右から左ナビ*/
.menu-box .menuBtn { display: none; }
.menuBtn {
    z-index: 100;
    position: fixed;
    z-index:100;
    top: 0;
    right: 0;
    margin: 0;
    padding: 60px 0;
    background:rgba(255, 255, 255, 0.9);
    color: #fff;
    text-align: center;
    transition: all 0.6s;
    width: 300px;
    height: 100vh;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
}

.menuBtn .sitename { max-width: 150px; margin: 50px auto 30px 1.5em;text-align: left; }
.menuBtn .sitename img { width: 100%; }

.menuBtn>ul.h_menu {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    font-family: fot-tsukuardgothic-std, sans-serif;
}

.menuBtn>ul.h_menu::after { content:""; clear:both; display:block; }

.menuBtn>ul.h_menu>li {
    float: none;
    margin: 0;
    font-size:1.2em;
    list-style-type: none;
    font-weight: bold;
    padding: 0;
    width: 100%;
    text-align: left;
    margin-bottom: 1em;
}
.menuBtn>ul.h_menu>li:last-child {
    padding-bottom: 0;
    border-bottom: none;
}
.menuBtn>ul.h_menu>li>a {
    position: relative;
    display: inline-block;
    padding: 5px 0;
    padding-left: 1.5em;
    text-decoration: none;
    color: #633e3b;
}
.menuBtn>ul.h_menu>li>a::after{
  content: '';
    position: absolute;
    bottom: 0;
    left: 1.5em;
    width: 100%;
    height: 2px;
    background: #fd4a32;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
}
.menuBtn>ul.h_menu>li>a:hover::after {
  bottom: -4px;
  opacity: 1;
  visibility: visible;
}

.menuBtn .subNav .btn_box { width: 100%; padding: 1em; }
.menuBtn .subNav .button { width: 49%; margin: 0 0 10px; }
.menuBtn .subNav .button a { display: block; text-align: center; /*width: 80%;*/ padding: .5em; margin: 0 auto; font-size: .9em; line-height: 1.4; }
.menuBtn .subNav .button a::before { /*right: 10px;*/display: none; }
.menuBtn .subNav .button.dantai a {
    background-image: linear-gradient(to right, #51beb0 0%, #94cec6 51%, #51beb0 100%);
}

.menuBtn .subNav>ul { width: 80%; margin: 0 auto; }
.menuBtn .subNav>ul>li { margin-bottom: .5em; }
.menuBtn .subNav>ul>li>a { display: block;color: #fff; background: rgba(59, 15, 15, 0.8); border-radius: 100px; padding: .3em 1em .2em; }


/* このクラスを、jQueryで付与・削除する */
.navToggle {
    display: block;
    position: fixed;
    right: 0;
    top: 0;
    cursor: pointer;
    z-index: 999;
    text-align: center;
    border-top: 80px solid #fd4a32;
    border-right: 80px solid #fd4a32;
    border-bottom:80px solid transparent;
    border-left: 80px solid transparent;
}
.navToggle span {
    display: block;
    position: absolute;
    top: 0;
    right: -50px;
    width: 40px;
    border-bottom: solid 4px #fff;
    border-radius: 100px;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
}
.navToggle span:nth-child(1) {
    top: -40px;
}
.navToggle span:nth-child(2) {
    top: -27px;
    width: 30px;
}
.navToggle:hover span:nth-child(2) { width: 40px; }

.navToggle span:nth-child(3),
.navToggle span:nth-child(4){
    border: none;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    top: 22px;
}
.navToggle span:nth-child(4)  { display: none; }

/* 最初のspanをマイナス45度に */
.navToggle.active span:nth-child(1) {
    top: -30px;
    right: -50px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

/* 2番目と3番目のspanを45度に */
.navToggle.active span:nth-child(2) {
    top: -30px;
    width: 40px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}
.navToggle.active span:nth-child(3) { display: none; }
.navToggle.active span:nth-child(4) { display: block; }


.bnr_seijin { padding: 0 1.5em; }
.bnr_seijin a { display: block; }

.bnr_wedding { padding: 0 1.5em; }
.bnr_wedding a { display: block; }

.menuBtn .bnr_studio { padding: 0 1.5em; }
.menuBtn .bnr_studio a { display: block; }

.menuBtn>ul.h_langBox { width: 80%; display: flex; flex-wrap: wrap; margin: 40px auto 20px; }
.menuBtn>ul.h_langBox>li { width: 49%; }
.menuBtn>ul.h_langBox>li:not(:first-child) { margin-left: 2%; }
.menuBtn>ul.h_langBox>li>a { display: block; padding: .3em 1em .2em; font-family: fot-tsukuardgothic-std, sans-serif; font-weight: 700; color: #fff; border-radius: 100px; }
.menuBtn>ul.h_langBox>li>a:hover { background: rgba(59, 15, 15, 0.8); color: #fff; }
.menuBtn>ul.h_langBox>li.en>a { background: #66c1b5; }
.menuBtn>ul.h_langBox>li.ch>a { background: #c67cbe; }
.menuBtn>ul.h_langBox>li.jp>a { background: #efa627; }

/* footer ------------------------*/
#footer { text-align: center;  padding: 80px 0; background: #564f4d; border-bottom: 17px solid #fd4a32; }

.flinkList { margin: 50px auto 40px; }
.flinkList li { margin: 0 5px;  }
.flinkList li a { display: block; padding: .2em 2em; color: #e7340c; border-radius: 100px; background: #fff;}
.flinkList li a:hover { color: #fff; background: #e7340c; }

.langList { margin: 0 auto 50px; }
.langList li a { display: block; padding: .2em 2em; color: #fff; border-radius: 100px; border: 1px solid #fff; }
.langList li a:hover { color: #fff; background: #e7340c; }

.copy-txt { color: #fff; }

.copyright { position: fixed; left: -80px; top: 50%; margin: 0;
    transform: rotate(90deg); -webkit-transform: rotate(90deg);
    font-size: 13px; font-weight: 400;
    color: #ff2a00;
}
.copyright a { text-decoration: none; color: #ff2a00; }
.copyright a:hover { text-decoration: none; color: #fff; }

/* common------------------------*/

.note { margin-top: 40px; padding: 40px 0; border-top: 1px dashed rgba(99, 62, 59, .5); }
.note h4 { font-size: 1.42em; }

.note-dot { background: #fff; padding: 20px; border-radius: 10px; border: 1px dashed rgba(99, 62, 59, .5); }

/* tel */

/* title */
.secTtl {
    display: inline-block; position: relative; text-align: center;
    margin-bottom: 1em;
    font-size: 2.85em;
    font-family: fot-tsukuardgothic-std, sans-serif;
    font-weight: 600;
    color: #633e3b;
    letter-spacing: .1em;
    line-height: 1.5;
}
.secTtl span { position: absolute; right: -50px; top: -50px; }

.subTtl {
    text-align: center;
    margin-bottom: 1em;
    font-size: 2.14em;
    font-family: fot-tsukuardgothic-std, sans-serif;
    font-weight: 600;
    color: #fd3232;
    letter-spacing: .1em;
}
.subTtl>span { display: inline-block; position: relative; padding: 0 1em; }
.subTtl>span::before, .subTtl>span::after { content:"";position: absolute; top: 0; }
.subTtl>span::before { left: 0; background: url("../img/deco_subTtl01.png") no-repeat; width: 13px; height: 10px; }
.subTtl>span::after { right: 0; background: url("../img/deco_subTtl02.png") no-repeat; width: 14px; height: 10px; }

#booking_g .subTitle {
    display: block;
    position: relative;
    text-align: center;
    margin-bottom: 1em;
    font-size: 2.85em;
    font-family: fot-tsukuardgothic-std, sans-serif;
    font-weight: 600;
    color: #633e3b;
    letter-spacing: .1em;
}

#booking_g .subTitle_en {
  letter-spacing: 0;
  line-height: 1.4;
}

#booking_g .subTitle_en .small {
  font-size: .75em;
}

.ttl_line {
    text-align: left;
    font-size: 1.5em;
    font-family: fot-tsukuardgothic-std, sans-serif;
    font-weight: 600;
    border-bottom: 1px solid rgb(253, 74, 50);
}



/* button */
.button { text-align: center; }

/* ボタンの基本的な部分 */
.button a {
    position: relative;
    display: inline-block;
    padding:.5em 3em .6em 3em;
    text-align: center;
    transition: 0.5s;
    background-size: 200% auto;
    color: #fff;
    box-shadow: 0 0 20px #eee;
    border-radius:500px;
    font-family: fot-tsukubrdgothic-std, sans-serif;
    font-size: 2.14em;
    font-weight: bold;
    letter-spacing: .1em;
    cursor: pointer;
}
.button a::before { content: ""; position: absolute; top: 50%; right:30px;
    background: url("../img/arrow.png") no-repeat center ;
    width: 28px; height: 28px;
    transform: translate(0,-50%); -webkit-transform: translate(0,-50%);}

/*ボタンの色*/
.button a {background-image: linear-gradient(to right, #FF8008 0%, #FFC837 51%, #FF8008 100%)}
.button a:hover { background-position: right center; }

.btn-brown { margin-top: 50px; }
.btn-brown a { padding: .5em 4em .6em 2em!important; font-size: 1.25em!important; background: #3b0f0f!important; }
.btn-brown a::before { background: url("../img/arrow_w.png") no-repeat center ; }


/* ホバーアニメーション */
@keyframes pulse {
    25% { transform: scale(1.1);}
    75% { transform: scale(.9);}
}
.pulse {
  display: inline-block;
}
.pulse:hover {
  animation-name: pulse;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}


/*table*/
.tbl { width: 100%; border-spacing: 0;  margin-bottom: 30px; }
.tbl tr th { width: 25%; padding: 30px; text-align: left; border-bottom: 2px solid #fd3232;vertical-align: middle; }
.tbl tr td { width: 80%; padding: 30px; text-align: left; border-bottom: 1px solid #fdeae6; }


#booking .flo_reserve { display: none; }
.bookingNav { width: 100%; max-width: 870px; margin: 0 auto 50px;}
.bookingNav >li { width: 24%; margin-bottom: 30px; }
.bookingNav >li:last-child { width: auto; margin: 0 auto; }

.bookingNav >li:not(:last-child) a { position: relative; display: block;
    padding: .5em 1em .6em; text-align: left;
    transition: 0.5s;
    background-size: 200% auto; color: #fff;
    border-radius: 500px;
    font-family: fot-tsukubrdgothic-std, sans-serif; font-size:1.25em; font-weight: bold;
    letter-spacing: .1em;
    cursor: pointer;
    background: #fcac20; }
.bookingNav >li:nth-child(2) a { background: #ed4d5f; }
.bookingNav >li:nth-child(3) a { background: #c67cbe; }
.bookingNav >li:nth-child(4) a { background: #5aa9d1; }

.bookingNav >li:not(:last-child) a::before {     content: "";
    position: absolute;
    top: 50%;
    right: .5em;
    background:url("../img/arrow_w.png") no-repeat center;
    width: 28px;
    height: 28px;
    transform: translate(0,-50%);
    -webkit-transform: translate(0,-50%); }

.bookingNav >li img { width: 100%; }


/* ---------------------------------------
Campaign
----------------------------------------- */
#campaign { background: url(../img/top/deco_square.png) no-repeat left 28px top 50px;  position: relative; }
#campaign::after {
    content: "";
    position: absolute;
    top: 50px;
    right: 0;
    background: url(../img/top/summer_campaign.png?20220916) no-repeat;
    width: 350px;
    height: 240px;
    background-size: 350px;
}
.campaign_txt{ text-align:center; font-family: fot-tsukuardgothic-std, sans-serif; font-weight: 600; color: #633e3b; font-size: 1.5em;}
/* ttl */
#campaign .secTtl { font-size: 2.2em; margin-bottom: 0.3em; }
#campaign .secTtl span { right: -10px; top: -50px; }
#campaign .secTtl span.red,#campaign .secTtl span.marker {  position: static; }
#campaign .secTtl.marker {
    background: linear-gradient(transparent 80%, #fff284 0%);
}

#campaign .zeikomi { margin: 1em auto; }
#campaign.october .zeikomi { font-size: .95em; }

#campaign .ex { margin: .1em auto 1em; font-family: fot-tsukuardgothic-std, sans-serif;  }
/* #campaign .ex { position: relative; display: table; margin: 2em auto; font-family: fot-tsukuardgothic-std, sans-serif;  } */
/* #campaign .ex::before {
  position: absolute;
  content: '';
  font-size: 2em;
  top: -0.5em;
  left: -1em;
  width: 0.8em;
  height: 0.8em;
  border-left: solid 2px #fd4a32;
  border-top: solid 2px #fd4a32;
}
#campaign .ex::after {
  position: absolute;
content: '';
font-size: 2em;
bottom: -0.5em;
right: -0.5em;
width: 0.8em;
height: 0.8em;
border-right: solid 2px #fd4a32;
border-bottom: solid 2px #fd4a32;
} */

/* ▽ */
.campaignList>li .cam { position: absolute;
  position: absolute;
  left: 0;
  top: 0;
  text-align: center;
  margin: 0;
  padding: 0.9em 0em .9em .25em;
  font-family: 'Damion', cursive;
  color: #fff;
  font-size: 1.4em;
  line-height: 0.8;
  z-index: 1;
}
.campaignList>li .cam span:first-child {letter-spacing: 0; }
.campaignList>li .cam>span+span { padding-right: 0.5em; font-size: 2em; }
.campaignList>li .cam>* {  display: block; }
.campaignList>li .cam::before {
    top: 0;
    left: 0;
    border-bottom: 3.1em solid transparent;
    border-right: 3.1em solid transparent;
    position: absolute;
    content: '';
    z-index: -1;
}

.campaignList>li.basic .cam::before {  border-top: 3em solid #efa627;  border-left: 3em solid #efa627; }
.campaignList>li.couple .cam::before {  border-top: 3em solid #f77685;  border-left: 3em solid #f77685; }
.campaignList>li.student .cam::before {  border-top: 3em solid #67bbd2;  border-left: 3em solid #67bbd2; }

/* figure */
.campaignList>li figure img {
    width: 100%;
    display: block;
    padding: 0 4px 4px 0;

}
.campaignList>li.basic figure img { box-shadow: 4px 4px #efa627; }
.campaignList>li.couple figure img { box-shadow: 4px 4px #f77685; }
.campaignList>li.student figure img { box-shadow: 4px 4px #67bbd2; }

/* txtBox */
.campaignList { margin-top: 3.5em; }
.campaignList > li + li {
    margin-top: 5em;
}
.campaignList>li .txtBox {
    padding-left: 0;
}
.campaignList>li .ttl {
    font-size: 2em;
    font-family: fot-tsukuardgothic-std, sans-serif;
    font-weight: 600;

}
.campaignList>li.basic .ttl { color: #efa627; }
.campaignList>li.couple .ttl { color: #f77685; }
.campaignList>li.student .ttl { color: #67bbd2; line-height: 1.5; }
.campaignList>li .sub {
  font-weight: bold;
  font-size: 1.1em;
  margin: 0;
  padding-bottom: 0.5em;
  margin-bottom: 1em;
  text-align: right;
  line-height: 1.5;
}
.campaignList>li.basic .sub { color: #efa627;
border-bottom: 1px dashed #efa627; }
.campaignList>li.couple .sub { color: #f77685;
border-bottom: 1px dashed #f77685; }
.campaignList>li.student .sub { color: #67bbd2;
border-bottom: 1px dashed #67bbd2; }
.campaignList>li .sub span {  color: #f10000; }
.campaignList>li .price {     margin: 0;
    font-family: 'Josefin Sans', sans-serif;
    font-size: 2.6em;
    letter-spacing: 0.8px;
    font-weight: 400; }
    .campaignList>li .price .small {
        font-size: .7em;
    }
.campaignList>li .list_ttl { margin-bottom: 0.3em; text-align: left;
    font-size: 1.5em;
    font-family: fot-tsukuardgothic-std, sans-serif;
    font-weight: 600; }
.campaignList>li .note-dot  { margin-top: 1em; }
#campaign .btn-brown a { background: #fd3232!important; }


/* ================================================================
  レスポンシブ
=================================================================== */
/* 600以上(PC・タブレット) */
@media screen and (min-width: 600px) {
  .langList li:not(:first-child) { margin-left: 10px; }

  .campaignList>li figure { width: 45%; }
  .campaignList>li .txtBox {  width: 51%; }
  #campaign .ex { font-size: 1.5em; }
}

/* 960以上(PC) */
@media screen and (min-width: 960px) {
}


/* ================================================================
  タブレット
=================================================================== */
@media screen and (max-width: 959px) {
  .inner { width: 80%; }

  .note { padding: 40px 20px; }

  .fix span:nth-child(1), .fix span:nth-child(3) { height: 10px; }
  .fix span:nth-child(2), .fix span:nth-child(4) { width: 10px; }

  /* header ------------------------ */
  #header { padding: 4% 17px 0 4%; }
  .h_info { padding-left: 20px; margin-left: 20px; }
  
  #hnav .langBox { top: 10px; }

  
  /* gnav ------------------------ */
  .navToggle { border-width: 60px; }


  /* footer ------------------------ */


  /*title*/
  #booking_g .subTitle { font-size: 2em; }
  #booking_g article { background-position: top 33% left 6%,top 60% right 6%,bottom -20px right -100px!important; }


  /* ---------------------------------------
  Campaign
  ----------------------------------------- */
  #campaign::after {
    width: 200px;
    background-size: 200px;
    top: 30px;
}
#campaign .secTtl { font-size: 1.85em; }
#campaign .secTtl span { top: -40px; }
.campaignList>li .ttl{ font-size: 1.5em; letter-spacing: -0.5px; }
.campaignList>li .list_ttl { font-size: 1.2em; }
.campaignList>li .price { font-size: 1.8em; }
.campaignList>li .cam { font-size: 1.1em; }
.campaignList>li .cam>span+span { font-size: 1.8em; }
.campaign_txt{ text-align:center; font-family: fot-tsukuardgothic-std, sans-serif; font-weight: 600; color: #633e3b; font-size: 1.5em;}
}


/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width: 599px){

  .inner { width: 85%;}

  /* loading------------------------ */
  .bg_loading:before,
  .bg_loading:after{ background-size: 40%; }
  #loading .loading_con { width: 60%; height: 120px; }


  /*枠線*/
  .fix span:nth-child(1),
  .fix span:nth-child(3) { height:5px;  }
  .fix span:nth-child(2),
  .fix span:nth-child(4) { width:5px;}
  .fix span:nth-child(3) { margin-top: -5px;  }


  /* header------------------------*/
  .h_info { display: none; }

  #hnav .langBox { top: 5px; right: 20%; width: 50%; padding: .5em 0; }
  #hnav .langBtn { margin-right: .5em; }
  #hnav .langBtn li a { padding: 0; }


  
  /* gnav------------------------*/
  .menuBtn  { width: 100%; padding: 60px 0; }
  .menuBtn  .sitename { margin: 40px auto; text-align: center;  }

  .menuBtn ul li a { display: block; }
  .menuBtn ul li a::after {
    left: 50%;
    right: 0;
    transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    width: 90%; }
  .menuBtn  .subNav>ul { width: 90%; margin: 20px auto 0; }
  /*.menuBtn .subNav .button a { width: 90%; }*/

  .menuBtn>ul.h_menu { margin-bottom: 1em; }
  .menuBtn>ul.h_menu>li { float: left; width: 48%; margin-bottom: .5em; }

  .menuBtn .subNav .btn_box { width: 90%; margin: 30px auto 0; padding: 0; }
  
  .navToggle {
    border-top: 40px solid #fd4a32;
    border-right: 40px solid #fd4a32;
    border-bottom: 40px solid transparent;
    border-left: 40px solid transparent;
  }
  .navToggle span:nth-child(1) { top: -20px; right: -30px; width: 30px; }
  .navToggle span:nth-child(2) { top: -10px; width: 20px; right: -30px;}

  .navToggle.active span:nth-child(1) { top: -18px; right: -30px; }
  .navToggle.active span:nth-child(2) { top: -18px;  width: 30px; }

  .navToggle:hover span:nth-child(2) { width: 30px; }


  /* footer------------------------*/
  #footer { border-bottom: 5px solid #fd4a32; }
  .f_logo { margin-bottom: 30px; }
  .flinkList { margin: 50px auto 30px;}
  .flinkList li { width: 100%; margin: 0 auto 10px; }
  .langList li { width: 100%; }
  .langList li:not(:first-child) { margin-top: 10px; }

  .copy-txt { font-size: .8em; }
  .copyright { position: static; transform: none; -webkit-transform: none; color: #fff; }
  .copyright a {  color: #fff; }

/* SP　バナー */
  .bnr_seijin { margin: 0; }
  .bnr_seijin img { width: 90%; }

  .bnr_wedding { margin: 0; }
  .bnr_wedding img { width: 90%; }

  .menuBtn .bnr_studio { margin: 0; }
  .menuBtn .bnr_studio img { width: 90%; }

  /* SP予約ボタン */
  .flo_reserve { position: fixed; right: 3%; bottom: 65px; }
  .flo_reserve a {
    text-align: center;
    display: block;
    padding: 0;
    color: #fff;
    background: url(../img/top/circle_orange.png) no-repeat center;
    width: 100px;
    height: 100px;
    font-family: fot-tsukubrdgothic-std, sans-serif;
    background-size: 100px;
  }
  .flo_reserve a p {
    position: relative;
    margin: 0;
    padding-top: 23px;
    font-size: 1.2em;
    font-weight: bold;
    line-height: 1.2;
    letter-spacing: .1em;
  }
  .flo_reserve a p::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -28px;
    transform: translate(-50%,0); -webkit-transform: translate(-50%,0);
    background: url(../img/arrow.png) no-repeat center;
    width: 28px; height: 28px; background-size: 15px;
  }
  .flo_reserve a p>span { display: block; }


  /* SPフローティング tel pagetop */
  .floList { z-index: 100; position: fixed; right: 0; bottom: 0; left: 0; }
  .floList li.tel { width: 80%; padding: 0; font-size: 2em; font-weight: 300; letter-spacing: .1em; background-image: none; background-color: rgba(253, 74, 50, 0.8) ; }
  .floList li.tel a { display: block; margin: .2em .6em 0; color: #fff; vertical-align: middle; }
  .floList li.tel a span { position: relative; padding-left: 1em; }
  .floList li.tel a span::before { content: ""; position: absolute; top: -2px; left: 0;
  background: url("../img/tel_w.svg") no-repeat center/20px; width: 26px; height: 26px;}

  .floList li#pagetop { position: relative; bottom: 0!important; width: 20%; background:rgba(255, 255, 255, 0.8); }
  .floList li#pagetop a {
    position: absolute; left: 50%; top: 53%;
    display: block;
    transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);
    line-height: 1.2;
    letter-spacing: .1em;
  }




  /* common ------------------------*/

  .note {  padding:20px; margin-top: 20px; }

  /* tel */

  /* title */
  .secTtl { font-size: 2em; }
  .secTtl span { right: 0; top: -40px; }

  .subTtl { font-size: 1.8em; line-height: 1.5; }
  .subTtl>span::before,
  .subTtl>span::after{ display: none; }

  #booking_g .subTitle {
    font-size: 1.5em!important;
    letter-spacing: 0;
  }


  /* button */
  .button a { display: block; padding: .5em 1em .6em; font-size: 1.5em; }
  .button a::before { right: .8em; }
  .btn-brown { margin-top: 30px; margin-bottom: 45px; }


  /*table*/
  .tbl tr th {
    display: block;
    text-align: center;
    width: 100%;
    padding: .5em;
    color: #fff;
    font-weight: bold;
    background: #564f4d;
    border-bottom: none;
  }
  .tbl tr td {
    display: block;
    width: 100%;
    padding: 10px 1em;
    margin-bottom: 20px;
    background: #fff;
    border-bottom: none;
  }

  .bookingNav { margin: 0 auto 20px;  }
  .bookingNav >li { width: 49%; margin-bottom: 10px;}
  .bookingNav >li:not(:last-child) a { padding: .5em .8em .6em; font-size: 1em; letter-spacing: 0; }

  /* ---------------------------------------
  campaign
  ----------------------------------------- */
  #campaign { padding-top: 9em;  background: url(../img/top/deco_square.png) no-repeat left 0 top 30px; background-size: 100px;
  }
  #campaign .secTtl {
      font-size: 1.35em;
      letter-spacing: -0.3px;
  }
  .campaign_txt{ text-align:center; font-family: fot-tsukuardgothic-std, sans-serif; font-weight: 600; color: #633e3b; font-size: 1.2em;}
  #campaign .secTtl span { top:-50px;  }
  #campaign .ex { margin-top: .8em; }
  .campaignList>li .list_ttl {
      font-size: 1.05em;
  }
  .campaignList>li .price {
      font-size: 2.3em;
  }
  .campaignList>li .ttl {
      font-size: 1.4em;
      letter-spacing: -0.5px;
  }
  .campaignList>li .txtBox { margin-top: 1.5em; }
  #campaign .note-dot { padding: 1.2em; }
  .campaignList>li .txtBox { width: 100%; }
  .campaignList>li .sub { padding-bottom: 0; font-size: 1em; line-height: 2; }
  #campaign::after { width: 140px;  background-size: 140px;}
  .campaignList {  margin-top: 1.5em; }

}


@media screen and (max-width:320px){

  .note { padding: 20px 0; }

  .floList li.tel { font-size: 1.5em; }
  .floList li.tel a span { padding-left: 1.5em; }

  #booking_g .subTitle { font-size: 1.2em!important; }


}
