@charset "utf-8";
/* CSS Document */
.form-attention {
	background: #ffe1ea;
	border-radius: 16px;
	text-align: left;
	padding: 30px;
	padding: 1em;
	margin-top: 2em;
}
.form-attention p {
	color: #FF0004;
	font-weight: bold;
	line-height: 1.5;
}

@media screen and (max-width:768px){
html{font-size:15px;}
body{font-size:100%;  background: url("../images/page20260719/body_bg_page20260719.jpg") no-repeat center top; background-attachment: fixed; background-size: cover;}
body.single-special_topics,
body.single-special {  background: url("../images/page20260719/body_bg_page20260719.jpg") no-repeat center top; background-attachment: fixed; background-size: cover;}
.content{width:100%;padding:0;}
.drawer-toggle{display:block;}
.spOnly { display: inherit;}
.pcOnly{ display:none;}
.br-sp { display: inherit}
.br-pc { display: none;}
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
	
/* header */
.inquiry { display: none; }

/* nav */
#nav-pc { display: none; }
#nav-sp { display: block; position: relative;}
	
.tit-letter img { width: 80%; height: auto; }
	
/* main */
body.special-template-default,
body.special_topics-template-default{ padding-top: 8vh;}
.container { padding-top: 0;}
	
/*/////top/////*/
#concept { width: 100%; text-align: center; margin: 0 auto; padding: 0; position: fixed; z-index: 999; top: 0; left: 50%;transform: translate(-50%, 0%);}
#concept .wrapbox ul { display: flex; justify-content: center; text-align: center;}
#concept .wrapbox ul { display: flex; justify-content: left; text-align: center;}
#concept .wrapbox li { list-style: none; margin: 0 1px; width: 30%; box-sizing: border-box;}
#concept .wrapbox li a {display: inline-block;
  font-size: 16px;
  padding: 2px 6% 0 2%;
  position: relative;
  z-index: 1;}
#concept .wrapbox li a::before {
  content: "";
  position: absolute;
  top: -40px;
height: 40px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: #FFF;
  transform: scaleY(-1) perspective(6em) rotateX(6deg);
  transform-origin: bottom left;
  border-radius: 8px 8px 0 0;box-shadow: 2.5px -2.5px 7.5px 0px rgba(0,0,0,0.15);
}
#concept .wrapbox li a img { width: 74%; height: auto;}
	
h3.notice { text-align: center;font-weight: bold; margin: 10px auto; font-size: 15px; line-height: 1.4em; 
background:#3077f4;color: #FFF; opacity: 0.85; width: 100%; height: auto; border-radius: 12px;}
h3.notice span {color: #000; text-shadow:1px 0px 3px rgba(0,0,0,0.15); }
p.notice-p { color: #000; width: 100%; text-align: left; margin: 0 auto 10px auto; padding: 0 10px; font-size: 13px;}
	
/* mainimg */
#mainimg { position: relative; width: 100%; background: #a0d2f8;}
#mainimg img { vertical-align: top; width: 100%; height: auto; margin: 0; padding: 0;}

/* MAIN */
#main { width: 100%; background: url("../images/page20260719/concept_bg_page20260719.jpg") repeat center top; padding: 40px 0;}
#main .wrapbox { width: 100%; text-align: center; margin: 0 auto;}
#main .wrapbox img { width: 100%; height: auto; padding: 0 10px;}
#main h2 { position: relative; background: url("../images/page20260719/h2_concept.png") no-repeat center top; width: 275px; height: 70px; background-size: 275px 70px;  text-align: center;margin: -50px auto 0px auto;overflow: hidden;text-indent: 100%;white-space: nowrap;}
	
/* topics */
#topics { width: 100%; padding: 20px 0 20px 0; background: url("../images/page20260719/topics_bg_page20260719_sp.jpg") no-repeat center bottom; background-size: cover; position: relative; background-attachment: fixed;}
#topics .wrapbox { width: 96%; text-align: center; margin: 0 auto;}
#topics .topics-post-list { }
#topics .topics-post-list li { float: none;  list-style: none; background: #FFF; width: 96%; height: auto; padding: 10px; box-shadow: 2.5px 2.5px 7.5px 0px rgba(0,0,0,0.15); border-radius: 8px; margin-right: 0; margin: 2%!important;}
#topics .topics-post-list li:hover {box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); -webkit-transform: translateY(-4px);transform: translateY(-4px); transition: -webkit-transform 400ms ease; transition: transform 400ms ease;  }
#topics .topics-post-list li:nth-child(2n) { margin-right: 0;}
#topics .topics-post-list li:last-child { margin-bottom: 0!important;}
#topics .topics-post-list li a { color: #000; text-decoration: none;}
#topics .topics-post-list figure { width: 150px; height: 150px; overflow: hidden;}
#topics .topics-post-list li img { width: 40%; height: auto; float: left;}
#topics .topics-post-list li .caption { float: left; margin-left: 2%; width: 58%;}
#topics .topics-post-list li .caption h2.topics-title { font-size: 13px; font-weight: bold; text-align: left; line-height: 1.4em; margin-bottom: 0.5em;}
#topics .topics-post-list li .caption p.topics-excerpt { text-align: left; font-size: 11px;} 

/* entry-topics*/
#entry-topics img { max-width: 100%; height: auto; margin: 0;}
#entry-topics h1 { font-weight: bold; font-size: 21px; margin-bottom: 10px; letter-spacing: 0em;}
#entry-topics h2 { font-weight: bold; font-size: 18px; margin-bottom: 10px; letter-spacing: 0em;padding-bottom: 5px; border-bottom: 4px solid #f2c4dc;}
#entry-topics h3 { font-weight: bold; font-size: 15px; margin-bottom: 10px; letter-spacing: 0em;padding-bottom: 5px; border-bottom: 3px dotted #baf1eb;}
#entry-topics h4 { font-weight: bold; font-size: 13px; margin-bottom: 10px; letter-spacing: 0em;padding-bottom: 0; padding-left: 10px; border-left: 4px solid #baf1eb;}

/* schedule */
#schedule { width: 100%;;background: url("../images/page20260719/model_bg_page20260719.jpg") no-repeat center top; background-size: cover;}
#schedule h2.maintit { position: relative; background: url("../images/page20260719/h2_models.png") no-repeat center top; background-size: 275px 70px; width: 275px; height: 70px; text-align: center; padding-top: 20px; margin: 60px auto -50px auto;overflow: hidden;text-indent: 100%;white-space: nowrap;}
#schedule .wrapbox { width: 96%; text-align: center; margin: 0 auto; padding: 1px 0 20px 0;}
	
/* primary */
#primary {width: 96%; text-align: center; margin: 0 auto;}
	
/* tab */
.tab_wrap{}
.tab_wrap input[type="radio"]{display:none;}
#tab1,#tab2,#tab3 { float: left;}
.tab_area{font-size:0; margin:0 0;}
.tab_area label{width:30%; margin:0 5px; display:inline-block; padding:12px 0; color:#999; border: 1px solid #ddd; background:#ddd; text-align:center; font-size:14px; font-weight: bold; cursor:pointer; transition:ease 0.2s opacity; border-radius: 6px;}
.tab_area label:hover{opacity:0.7;}
.tab_panel{width:100%; padding:20px 0 0 0; display:none;}
	
.btnMoreF { text-align: center; margin: 0 auto 10px auto;}
.btnMoreF a { display: block; font-weight: bold; color: #000!important;background: rgb(96,210,197);
background: -moz-linear-gradient(left, rgb(96,210,197) 0%, rgb(168,247,234) 30%, rgb(249,161,219) 75%, rgb(243,222,236) 100%);
background: -webkit-linear-gradient(left, rgb(96,210,197) 0%,rgb(168,247,234) 30%,rgb(249,161,219) 75%,rgb(243,222,236) 100%);
background: linear-gradient(to right, rgb(96,210,197) 0%,rgb(168,247,234) 30%,rgb(249,161,219) 75%,rgb(243,222,236) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#60d2c5', endColorstr='#f3deec',GradientType=1 );font-size: 15px; letter-spacing: 0.1em; border-radius: 18px; width: 260px; height: 36px; line-height: 36px; text-align: center; margin: 0 auto; text-decoration: none;}
	
.btnMore { margin: 20px auto 0 auto;}
.btnMore a { display: block; font-weight: bold; color: #000; background: #fff69d; font-size: 15px; letter-spacing: 0.1em; border-radius: 18px; width: 260px; height: 36px; line-height: 36px; text-align: center; margin: 0 auto; text-decoration: none;}
	
.btnAma { margin: 20px auto 0 auto;}
.btnAma a { display: block; font-weight: bold; color: #131A22; background: #94d8ef; font-size: 13px;border-radius: 18px; width: 210px; height: 36px; line-height: 36px; text-align: center; margin: 0 auto; text-decoration: none;}
	

/* card */
.card { background: #FFF; padding: 10px; text-align: left; margin-top: 10px; margin-bottom: 10px; box-shadow: 2.5px 2.5px 7.5px 0px rgba(0,0,0,0.15); border-radius: 8px;}
.card .Lcover { float: none; width: 100%; margin-right: 0; vertical-align: top; line-height: 0; padding: 0; margin-bottom: 10px; }
.card .Lcover img { width:100%; height: auto;}
.card .Rinfo { float: none; width: 100%; height: auto;}
.card .Rinfo ul { margin-left: 20px; font-size: 11.5px;}
.card p { margin: 0 0 5px 0; padding: 0; text-align: inherit; font-size: 11.5px;}
.card p span.price { font-size: 15px; font-weight: bold;}
.card h3 {font-weight: bold; }
.card h3.date { font-size: 15px; padding-top: 10px; }
.card h3.name { font-size: 21px; color: #fe4195;margin-bottom: 10px;}
.card h4 { font-size: 13px; margin: 10px 0 5px 0; letter-spacing: 0.2em;}
.card h4 span { color: #FFF; background: #000; font-weight: bold; padding:  2px 6px;}
.card .schDetail { clear: both;vertical-align: top; padding-top: 10px;}
.card table {width: 100%; border-collapse: collapse; border: 1px solid #a1aeae; margin-top: 10px; font-size: 11px;}
.card table th { padding: 5px; background: #f39bb8; font-weight: bold; text-align: center; border: 1px solid #aea1a1;}
.card table td { padding: 5px; background: #FFFFFF; font-weight: 500; text-align: center; border: 1px solid #aea1a1;}
/* #schedule .card table tr.Full td { background:#EEEEEE; color: #999;} */
.card .btnFull,
.card .btnEntry { margin: 10px auto 0 auto;}
.card .btnFull a { display: block; font-weight: bold; color: #FFF!important; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff4195+0,4642be+100 */
background: #333;font-size: 15px; letter-spacing: 0.1em; border-radius: 18px; width: 100%; height: 36px; line-height: 36px; text-align: center; margin: 0 auto;}
.card .btnEntry a { display: block; font-weight: bold; color: #FFF; background: #b77cd2; font-size: 15px; letter-spacing: 0.1em; border-radius: 18px; width: 100%; height: 36px; line-height: 36px; text-align: center; margin: 0 auto;}
	
.wpcf7-submit { width: 260px;}
	
/* ad */
.ad,.ad02 { width: 100%; text-align: center; margin: 20px auto; }
.ad .wrapbox,
.ad .wrapbox02 { width: 100%;text-align: center; margin: 0 auto; }
.ad .wrapbox .ad-lable,
.ad02 .wrapbox .ad-lable { margin-bottom: 5px;}
	
.ad .wrapbox li { float: left; display: block; width: 50%; margin: 0 0 0 0; padding: 0 0.25em; list-style: none;}
.ad .wrapbox li:last-child { margin: 0;}
.ad .wrapbox li img.ad01  { width: 100%; height: auto;}

/* pagination */
.pagenation {clear: both;padding: 20px 0 20px 0;position: relative;font-size: 12px;line-height: 1em;text-align: center; margin: 0 auto;}
.pagenation:after, .pagenation ul:after {clear: both;content: ".";display: block;height: 0;visibility: hidden;}
.pagenation ul {margin: 0;}
.pagenation li {display: inline-block;list-style: none outside none;margin-left: 0;}
.pagenation li:first-child {margin-left: 0;}
.pagenation li.active {background: #cd74a2; border: 1px solid #cd74a2; color: #FFF;cursor: not-allowed;padding: 10px 12px 10px 12px;border-radius: 50%;}
.pagenation li a {display: block;margin: 0 0 0 0;padding: 10px 12px 10px 12px;text-decoration: none;width: auto;color: #fff;background: #59b5ac;border-radius: 50%; border: 1px solid #59b5ac;}
.pagenation li a:hover {color: #59b5ac;background: #FFF;border: 1px solid #59b5ac;}
.pagenation li.next a,
.pagenation li.prev a { background: none; color: #000; border: none;}
	
/* post-list */
.post-list { }
.post-list li { float: left;  list-style: none; background: #FFF; width: 46%; height: auto; padding: 10px; box-shadow: 2.5px 2.5px 7.5px 0px rgba(0,0,0,0.15); border-radius: 8px; margin: 2%;}
.post-list li:nth-child(3n) { margin-right: 2%;}
.post-list li:nth-child(2n) { margin-right: 2%;}
.post-list li a { color: #000; text-decoration: none;}
.post-list li img { width: 100%; height: auto;}

/* top,archive,tag */
.entry-cat { width: 64px; height: auto; margin-bottom: 5px;font-size: 11px;}
.entry-cat a:link,
.entry-cat a:visited { display: block; color: #FFF; background: #5bc9bd; padding: 0 2px; font-weight: bold; text-decoration: none; text-align: center; margin: 0 auto;letter-spacing: 0.05em; }

h2.archive-title { font-weight: bold; font-size: 140%; margin: 20px auto; text-align: center;}
h2.entry-title { text-align: left; font-size: 70%; background: none;}
h1.signle-title { font-size: 200%; margin-bottom: 2%; letter-spacing: 0.1em; font-weight: 500;}

.caption .date { font-size: 11px; text-align: left; font-weight: bold; line-height: 1.4em; min-height: 20px;}
.caption .name { font-size: 13px; text-align: left; font-weight: bold; color: #ff7bc0;}
	
.onoff-ON { position: relative; z-index: 49; font-weight: bold; width: 55px; font-size: 11px; top: 0; margin-bottom: -26px; margin-left: 0; float: right; /* border: 1px dashed #d978ab; */ background: #d978ab; color:#FFF;animation: key1 .3s ease infinite alternate; padding: }
@keyframes key1{
  0% {transform: translateY(0px);}
  100% {transform: translateY(-5px);}
}
.onoff-PRE { position: relative; z-index: 49; font-weight: bold; width: 55px; font-size: 11px; top: 0; margin-bottom: -26px; margin-left: 0; float: right; /* border: 1px dashed #d978ab; */ background: #78afd9; color:#FFF;animation: key2 .3s ease infinite alternate; padding: }
@keyframes key2{
  0% {transform: translateY(0px);}
  100% {transform: translateY(-5px);}
}
.onoff-LIT { position: relative; z-index: 49; font-weight: bold; width: 60px; font-size: 11px; top: 0; margin-bottom: -26px; margin-left: 0; float: right; /* border: 1px dashed #d978ab; */ background: #ce3f3f; color:#FFF;animation: key3 .2s ease infinite alternate; padding: }
@keyframes key3{
  0% {transform: translateY(0px);}
  100% {transform: translateY(-5px);}
}
.onoff-SEL { position: relative; z-index: 49; font-weight: bold; width: 55px; font-size: 11px; top: 0; margin-bottom: -26px; margin-left: 0; float: right; /* border: 1px dashed #d978ab; */ background: #d9d378; color:#000;animation: key4 .3s ease infinite alternate; padding: }
@keyframes key4{
  0% {transform: translateY(0px);}
  100% {transform: translateY(-5px);}
}
.onoff-OFF { position: relative; z-index: 49; background: url(../images/label_OFF.png) no-repeat left top; background-size: 75px 75px; width: 75px; height: 75px; top: -75px; margin-bottom: -77px; margin-left: 21vw; overflow: hidden;text-indent: 100%;white-space: nowrap;}
	
.onoff-soldout { position: relative; z-index: 49; background: url(../images/label_soldout.png) no-repeat left top; background-size: 75px 75px; width: 75px; height: 75px; top: 20px; margin-bottom: -77px; margin-left: 80%; overflow: hidden;text-indent: 100%;white-space: nowrap;}
	
.onoff-heart { position: relative; z-index: 100; background: url(../images/label_heart.png) no-repeat left top; background-size: 24px 24px; width: 24px; height: 24px; top: 0; margin-bottom: -24px; margin-left: 31vw; overflow: hidden;text-indent: 100%;white-space: nowrap;animation: key5 .9s ease infinite alternate;}
@keyframes key5{
    0% {transform: scale(0.7);} 
    100% {transform: scale(1.4) translateY(-10px);} 
}

.onoff-LOT { position: relative; z-index: 49; font-weight: bold; width: 77px; font-size: 11px; top: 0; margin-bottom: -26px; margin-left: 0; float: right; /* border: 1px dashed #d978ab; */ background: #bf78d9; color:#FFF;animation: key6 .3s ease infinite alternate; padding: }
@keyframes key6{
  0% {transform: translateY(0px);}
  100% {transform: translateY(-5px);}
}
	
.onoff-10 { position: relative; z-index: 49; font-weight: bold; width: 64px; font-size: 11px; top: 0; margin-bottom: -26px; margin-left: 0; float: right; /* border: 1px dashed #d978ab; */ background: #ec9650; color:#FFF;animation: key7 .3s ease infinite alternate; padding: }
@keyframes key7{
  0% {transform: translateY(0px);}
  100% {transform: translateY(-5px);}
}
	
.tags { font-size: 12px;}
	
.onlySP { display: inherit; text-align: center; margin-top: 5px; font-size: 11.5px;}

	
/* page-top */
#page-top { position: fixed; right: 10px; bottom: 10px; z-index: 50; cursor:pointer;}
#page-top a { position: relative; display: block; width: 40px; height: 40px; border-radius: 20px; background: #FFF; box-shadow: 0 2px 2px 2px rgba(0,0,0,0.1);}
#page-top a span {position: absolute;top: 6px;bottom: 2.5px;left: 13px;margin: auto;content: '';vertical-align: middle;width: 12px;height: 12px;border-top: 2px solid #b77cd2;border-right: 2px solid #b77cd2;-webkit-transform: rotate(-45deg);transform: rotate(-45deg); }
	
/* realtime */
#realtime { position: fixed; margin: 0 auto; left: 0; bottom: 10px; background: #FFF; box-shadow: 2.5px 2.5px 7.5px 0px rgba(0,0,0,0.15); border-radius: 0 8px 8px 0; padding: 5px;text-align: center; width: 80px; z-index: 999;}
#realtime p { font-weight: bold; font-size: 11px; margin-bottom: 2px; line-height: 1.2em; }
#realtime .realtimeuserscounter a { font-size: 9px; color: #999; text-decoration: none; -moz-transform: scale(0.6);-webkit-transform: scale(0.6);-o-transform: scale(0.6);-ms-transform: scale(0.6);transform: scale(0.6); display: none;}
#realtime .realtimeuserscounter__num { background: #b77cd2; color: #FFF; font-weight: bold; font-size: 13px;}
	
/* music */
#music { position: fixed; right: 5px; top: 5px;z-index: 999;}
#music .bgm-wrap img.on {display: inline-block;}
#music .bgm-wrap img.off {display: none;}
#music .bgm-wrap.play img.on {display: none;}
#music .bgm-wrap.play img.off {display: inline-block;}
#music img { width: 36px; height: auto; outlineline:0; cursor: pointer;}
#music p { position: fixed; right: 5px; top: 38px; font-weight: bold; font-size: 10px; letter-spacing: -0.03em; opacity: 1; color: #FFF; text-shadow: 1px 1px 1px rgba(0,0,0,0.45); z-index: 999; line-height: 1em;}
#music p.music03 { position: fixed; right: 5px; top: 42px; font-weight: bold; font-size: 10px; letter-spacing: -0.04em; opacity: 1; color: #FFF; text-shadow: 1px 1px 1px rgba(0,0,0,0.45);z-index: 999; line-height: 1em;}
	
/* Rform */
#Rform h1 { font-weight: bold; font-size: 115%; color: #ff45a7; margin-bottom: 20px;}
#Rform {padding: 0; }
#Rform p { font-size: 80%;}

.reserve-list-box{margin-bottom:60px;padding:10px;background:#fff; margin: 5px;}
.reserve-list-box p { font-size: 14px; margin-bottom: 10px;}
.reserve-list-box a { text-decoration: underline; font-weight: bold; color: #3d6ea6;}
.reserve-list-box .terms-list { list-style: none; padding: 5px; }
.reserve-list-box .terms-list h3 { margin: 10px 0 5px 0;}
.reserve-list-box .terms-num-list li {font-size: 80%; counter-increment: cnt; list-style: none;}
.reserve-list-box .terms-num-list li:before { display: marker;content: "(" counter(cnt) ") ";}
.reserve-list-box .disc li{ font-size: 80%;  counter-increment:none; list-style: disc; margin-left: 20px;}
.reserve-list-box .disc li:before { display: none; content: none;}
	
.form-btnbox { padding-top: 40px; text-align: center; margin: 0 auto;}
.form-btnbox .btn-confirm { padding: 10px 20px; font-size: 120%; margin: 10px;}
.form-btnbox .btn-reset { padding: 10px 20px; font-size: 120%; margin: 10px;}
	
.reserve-table { width: 100%; text-align:center;border:1px solid #e4e4e4; border-collapse: collapse;  -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;box-sizing: border-box;}
.reserve-table th,
.reserve-table td{border:1px solid #e4e4e4;text-align: left; padding: 10px 10px; width: 100%; height:auto; display: block; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; font-size: 11px; margin: 0;}
.reserve-table th{background: #f2f8f8;}
.reserve-table td{height:auto; background: #FFF;}
.reserve-table .attention { background: #e53959; border-radius: 6px; font-size: 11px; color: #FFF; padding: 2px 6px;}
.reserve-table input[type="text"] {}
.reserve-table textarea { width: 80%; height: 40px; padding: 5px;-webkit-appearance: none;border-radius: 0;}

input[type="text"],
input[type="email"],
input[type="tel"]{-webkit-appearance: none;border-radius: 0;width: 70%; padding: 5px;}
input[type="submit"] {-webkit-appearance: none;}

.form-next { text-align: center; margin: 10% 10%;}
.form-next h5 { font-weight: bold; padding-bottom: 20px;}
.form-next p {color: #e53959; font-size: 100%;}
	
	
/* topへ戻る */
p.pagetop{margin-bottom:43px;right:10px;}
p.pagetop a{margin-bottom:0;position:initial;}

}


@media screen and (max-width:414px){
.post-list li { height: 290px!important;}
}


@media screen and (max-width:375px){
.post-list li { height: 290px!important;}
}

@media screen and (max-width:320px){
.post-list li { height: 265px!important;}
}