﻿@import url(https://fonts.googleapis.com/earlyaccess/kokoro.css);
/* Reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,#header,.header_inner,hgroup,menu,nav,output,ruby,.section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:16px 100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,#header,.header_inner,hgroup,menu,nav,.section,.row{display:block}body{line-height:1.6em}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
body {font-family:"Kokoro","ＭＳ Ｐ明朝", "Courier New","MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", arial, sans-serif; width:100%; text-align:center;}
a {text-decoration:none}
a:focus { outline:none;}
p { line-height:1.6em;font-family:"Kokoro"; margin-bottom:1em}
dt,dd,td,div{font-family:"Kokoro";}
p .txt_s{font-size:14px}
img{max-width:100%; height:auto; display:block; margin:0 auto;}
h1,h2,h3,h4{text-align:center;font-weight:bold; line-height:1.2em; letter-spacing:1px; color:#450102}
h1{font-size:38px;}
h2{font-size:34px; text-align:left; font-family:Courier New;}
h3{font-size:16px;}
ul,li,p,table,td,tr,a{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.br{display:inline-block}
.bgdp{background-color:#ec6d88}/* dark pink */
.bgpp{background-color:#f9b4c6}/* pale pink */
.bgwh{background-color:#ffffff}
.txtwh{color:#fff}
.menu{display: none; opacity: 1; position: fixed; width: 100%;  height: 100%;  color: #eb6d85;  z-index: 99;max-width:400px; background-color:#450102;}
.menu .nav { width: 100%; margin-top: 50px;margin-bottom: 46px; position: static; ext-align:center; background:none;}
nav ul {text-align:center; line-height:1.8em}
nav ul li{margin-bottom: 20px;font-size:18px}
nav ul li a{color:#eb6d85}
nav ul li a:hover {opacity: 0.8;}
nav ul li span{display:block;;font-size:14px  }
nav ul li.linksns a {display: inline-block; width:34px; height:34px; margin:5px;}
/*menu open close button*/
.button { position: fixed;top: 8px;left: 20px; width: 50px;  height: 36px; vertical-align: top; font-size:40px; z-index: 3;}
.button a {text-decoration:none;}
.btn-open:after {color:#eb6d85;content:"\f0c9";font-family:"FontAwesome";transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-o-transition:all .2s linear 0s;}
.btn-open:hover:after {opacity: 0.8;}
.btn-close:after {color:#eb6d85;content:"\f00d";font-family:"FontAwesome";transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-o-transition:all .2s linear 0s;}
.btn-close:hover:after {opacity: 0.5;}
#header {position:fixed;width:100%;height:50px;background-color:#450102; z-index:10;}
#header .lead, #header h1.lead{font-size:12px; font-weight:normal; line-height:1.4em;letter-spacing:normal;color:#fff; text-align:right;margin-top:10px;margin-right:4%; margin-left:62px}
#container{padding-top:50px;overflow:hidden; width:100%; background-color:#ffffff;clear:both;}
.tit{margin:4% 0; text-align:center; padding-top:0}
.tit img{margin-bottom:1%}
ul.flex{display:flex;flex-wrap:wrap;-ms-flex-wrap: wrap;clear:both; overflow:hidden;}
ul.flex img{width:100%;}
/* top */
#top{position:relative}
#top #topcv{position:absolute; top:0; left:0;width:100%}
#top #topcv img{width:100%;}
#top video{width:100%; display:block}
#top .top_logo{position:absolute; top:10%; right:10%; width:30%; max-width:260px;}
#toppic{position:relative;display:none;}
#top #modal{display:none}
#toppic img{width:100%; height:auto}
.btnmv{position:absolute;right:0; left:0;bottom:6%; margin:auto;background-color:#fff; height:auto; line-height:46px;width:80%; max-width:300px;border-radius:4px; }
.btnmv a{display:block; margin-left:20px;color:#000; padding:8px}
.btnmv::before{
position: absolute;
content: url(../images/btn_mvplay.png);
top: 50%;
left: 10px;
width: 40px;
height: 40px;
margin-top: -20px;
background-size: 20px 40px;
line-height:40px;
}
/* schedule */
ul.sch{padding-top:4%}
ul.sch{justify-content:center;}
ul.sch li{width:31%; max-width:400px;margin:0 0.5%; padding:1%;background-color:#fff; margin-bottom:3%; font-size:14px;border:solid 5px #f6b2c7; }
.area{font-size:20px; margin-bottom:6%}
.evebtn{position:relative;color:#f1d66b; font-size:16px; border:solid 2px #f1d66b; padding:2% 0;max-width:240px; margin:0 auto;margin-bottom:4%; }
.evebtn.cs{border:solid 2px #ec6d88; color:#ec6d88}
.evebtn::after {
position: absolute;
content: "＞";
top: 50%;
right: 10px;
width: 12px;
height: 20px;
margin-top: -12px;
background-size: 12px 20px;
line-height:20px;
}
.place{font-size:12px; line-height:1.4em}
.evedate{color:#7dc5c6; line-height:1.4em; margin-bottom:2%}
ul.sch li h3{margin-bottom:10%;}
ul.sch a {color:#450102;}
ul.sch li.menu-item{width:80%; text-align:center; margin:0 auto; margin-bottom:4%}
ul.sch li.menu-item a{padding:0 6%; display:block}
/* contents */
ul.cnt.flex{overflow:visible}
ul.cnt li{width:31.7%; margin:0 0.8%; margin-bottom:8%;position:relative}
ul.cnt >:first-child {width:65%}
ul.cnt li .clickguid{position:absolute;left:8px; top:-8%; width:164px}
/* about */
.abt {background-image: url(../images/about_back_img.jpg);background-position: center center;background-size:cover;height: auto;}
.abt p{text-align:left;background-color:rgba(256,256,256,0.8);color:#450102;padding:4%; width:96%; margin:4% auto;line-height:1.8em}
.empk{color:#ec6d88; font-size:20px}
/* review */
#review h2{font-size:20px;padding:4% 0}
ul.instabox{margin:0 auto}
ul.instabox li{ position: relative; width:168px; height:168px; float:left; margin:2px; overflow:hidden}
ul.instabox li img.thumb{position:relative;width: auto; height: 168px; max-width:120%;}
ul.instabox li img.long{position:relative;left:-10%;}
/* news */
#news{background-color:#ffffff; clear:both}
#news table {width:100%;background-color:#ffffff; color:#000; text-align:left; margin-bottom:4%}
#news table tr{/*border-bottom:dotted 1px #000; */}
#news table tr td{line-height:1.6em;padding:1% 10%;}
#news table tr:first-child td {padding-top:0;}
#news table tr td .date{font-size:14px;font-weight:bold;display:inline-block; box-sizing:border-box; margin-right:4%}
#news table a{color:#000000;}
/* sponsor */
#sponsor{background-color:#e5e5e5;}
#sponsor h2{padding:0;width:100%; margin-bottom:4%}
#sponsor ul li{display:inline-block; width:30%; margin-bottom:4%}
.inner{width:100%; max-width:898px; margin:0 auto; overflow:hidden; padding-bottom:1%;}
/* special contents */
ul.spcnt{width:100%;margin:0 auto}
ul.spcnt li{width:48%; margin:0 1%;}
ul.spcnt li{margin-bottom:4%; background-color:rgba(256,256,256,0.5);padding:1%;}
ul.spcnt li > div {position:relative; margin-bottom:22%}
ul.spcnt li a {color:#ec6d88}
ul.spcnt li .point{position:absolute; bottom:-80px;/*top:80%;*/width:41%}
ul.spcnt li h3{margin-bottom:2%;clear:both}
.boxbw{padding:2%; border:solid 1px #450102; text-align:left;margin-bottom:1%}
ul.spcnt li .detail{position:absolute; bottom: 4%;right:4%; width:120px;padding:8px 48px 8px 30px; border:solid 2px #ec6d88;background-color:#fff; border-radius:26px; font-weight:bold}
ul.spcnt >:first-child {width:100%; margin-bottom:4%}
ul.spcnt >:first-child > div {margin-bottom:14%}
ul.spcnt >:first-child p{max-width:767px; margin-right:auto; margin-left:auto}
ul.spcnt >:first-child .point{width:20.6%}
ul.spcnt >:first-child .boxbw{margin-top:2%}
.trg {width: 0;height: 0;border-left: 14px solid #ec6d88;border-top: 14px solid transparent;border-bottom: 14px solid transparent;display: block;position: absolute;right: 14%;top: 50%;margin-top: -14px;}
/* chocostation page */
#st_top{background-color:#f9b4c6}
#st_top .inner{padding-bottom:0; max-width:1000px}
#st_menu{padding-top:2%}
#st_menu h2{text-align:center;font-family:"Kokoro"; padding-top:0;padding-bottom:0.6em}
ul.st_menu{display:flex;flex-wrap:wrap;-ms-flex-wrap: wrap;clear:both; overflow:hidden; margin-bottom:1.2% }
ul.st_menu li{color:#e57083;border:solid 5px #e57083; position:relative;font-family:"Kokoro";font-size:14px}
/*ul.st_menu li a{display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center;
	-webkit-justify-content: center; justify-content: center;}	*/
ul.st_menu a{color:#e57083;padding:0.8%; padding-right:20px; height:100%; display:block}
ul.st_menu > li a::after {
position: absolute;
content: "＞";
top: 50%;
right: 6px;
width: 12px;
height: 20px;
margin-top: -12px;
background-size: 12px 20px;
line-height:20px;
}
ul.st_menu > li a::after {right: 10px;}
ul.st_menu a:hover{background-color:#450102; color:#fff}
/*ul.st_menu.brand li,ul.st_menu.drink li,ul.st_menu.bakedsweets li{width:31.7%; margin:0 0.8%;}*/
ul.st_menu li{width:48%; margin:0 0.8% 1% 0;}
ul.st_menu li{font-size:24px;}
ul.st_menu li a{padding-top:4%; padding-bottom:4%;}
/*ul.st_menu.flavor li,ul.st_menu.drink li,ul.st_menu.bakedsweets li {font-size:16px;}*/
.st_tit,.st_main_tit{background-image: url(../images/flow_back.jpg);	background-position:center top}
.st_main_tit{background-image: url(../images/chocostation_title_back.jpg);	background-position:center top}
.st_tit{margin:1.8em 0 1em 0}
.st_tit img{padding:2% 0 2% 0; width:70%; max-width:312px; min-width:210px}
.st_main_tit img{padding::  ;% 0 2% 0; width:100%; max-width:700px; min-width:210px}
h2{padding-top:8%}
#colombin h2, #brookside h2, #meito h2, #sns h2{margin:2% 0; text-align:center; padding-top:0}
#colombin h2 img, #brookside h2 img,#sns h2  img{margin-bottom:1%}
.txt_jp{display:block;margin:4px 0; font-size:14px; font-family:Kokoro}
ul.st_item{display:flex;flex-wrap:wrap;-ms-flex-wrap: wrap;clear:both; overflow:hidden; }
ul.st_item img{width:100%; margin-bottom:10%;}
ul.st_item li{width:24%; margin:0 0.5%; padding:1%;background-color:#f2f2f2; margin-bottom:3%; font-size:14px;}
ul.st_item li h3{margin-bottom:10%;}
ul.st_item a {color:#000;}
/* sns */
.inscont{
  max-width: 767px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto;
  padding-top:10px;
}
.inscont li{
  position: relative;
  width: 30%;
  height: auto;
  margin: 0 1% 10px;
}
.inscont li .image{
  position: relative;
  width: 100%;/*　トリミングしたい枠の幅（固定にしたい場合はサイズを入力）　*/
  padding-top: 100%;/*　トリミングしたい枠の高さ（固定にしたい場合はサイズを入力）　*/
  overflow: hidden;/*　画像が枠からはみ出た部分はトリミング（非表示）する　*/
  margin: 0 auto;
}
.inscont li .image img{
/* 画像を上下左右に中央配置する（絶対指定） */
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  /* 画像の最大サイズは枠の1.5倍まで */
  max-width: 150%;
  max-height: 150%;
}
.inscont li a{  text-decoration: none;}
.inscont li a:hover img{  opacity: 0.8;}
/* flow page */
#container.flow #top{position:relative;background-image: url(../images/flow_back.jpg);	background-position:center top}
#container.flow #top img.board{padding-top:4%; width:40%;margin-left:0}
#container.flow #top img.girls{position:absolute; left:46%; bottom:0; width:54%;max-width:500px;height: auto;    vertical-align: bottom;    display: block;    margin: 0 auto;    padding: 0;    border: none;    outline: none;}
.emph{background-color:#FFAEAE; padding:0 4px}
span.br_txt { display: inline-block;}
#lead{border-top:solid 10px #ec6d88; border-bottom:solid 10px #ec6d88; padding:30px 0}
#run{margin-bottom:5px; border-bottom:solid 1px #000}
#run img{width:100%; height:auto; display:block}
.section{border-top: solid 10px #000; margin-bottom: 5px; border-bottom: solid 1px rgb(0, 0, 0); }
#message.section{ margin-bottom:0;border-bottom:none}
.section .tit, .section .tit h2{text-align:center; margin:0}
.section .tit img{margin-bottom:6px; max-width:90px; width:10%;height:auto}
.section .tit h2{margin-bottom:20px;padding:0; color:#000}
.section .tit_sub{font-size: 28px; line-height:1.2em; font-weight: bold;color:#fff; width:100%; background-color:#000;text-align: center;padding: 10px;clear: both; margin-bottom:2%; box-sizing:border-box}
.section .contents {border-top: dotted 2px #000; background-image: url(../images/flow_back.jpg);background-position:center top;height: auto; padding-top:40px}
.section .contents h3{color:#000;display:block;margin-bottom:40px}
.section .contents .arrow{margin-bottom:2%; max-width:77px; width:8%; height:auto}
.section .contents p{box-sizing:border-box;border:solid 1px #000; -webkit-box-shadow:10px 10px 0px 0px #000000;box-shadow:10px 10px 0px 0px #000000;-moz-border-radius: 16px;  -webkit-border-radius: 16px;  border-radius: 16px; background-color:#FFF;padding:4%; width:94%; max-width:560px; text-align:left;margin:0 auto; margin-top:2%;margin-bottom:4%}
.section .contents ul li{display:inline-block; width:48%;margin:0 0.5%; margin-bottom:1.6%}
/* qa page */
h1.page-header,h2.page-header {border-bottom: 3px solid #450102; line-height:42px;color:#FF0068; font-weight:bold; margin-bottom:20px; text-align:left; padding-top:4%}
.header_txt{text-align:left; color:#FF0068; display:block}
h1 .header_txt,h2 .header_txt {font-size:20px; font-weight:normal}
h3.subhead {font-size:16px; font-weight:bold; color:#ffffff; background-color:#450102; text-align:left;line-height: 20px; padding: 10px 10px 7px 15px; display:block;clear:both; margin-top:40px; margin-bottom:20px}
.que, .ans { background-size:5% auto; line-height:24px; padding-left:70px; padding-top:16px; padding-bottom:24px;text-align:left}
.que {background: url(../images/icn_que.png) no-repeat top left }
.ans{background: url(../images/icn_ans.png) no-repeat top left;  padding-bottom:30px; border-bottom:1px solid #CCC; margin-bottom:20px}
ul.qa_index {clear:both; margin-bottom:20px; width:104%; margin-right:-4%;overflow:hidden ;}
.triangle{width: 0px;height: 0px;border-style: solid;border-width: 8px 0 8px 12px;border-color: transparent transparent transparent #450102; float:left; margin-right:4px;margin-top:7px}
ul.qa_index li a {float:left; margin-right:3%; display:block; padding:10px 0; text-decoration:none; color:#000}
/* media page */
ul.media{overflow:hidden}
ul.media li{width: 45%;float: left;border-bottom: 1px solid #B5B5B5;padding-bottom: 5%;margin-bottom:5%;margin-right: 10%; overflow:hidden;min-height:200px}
ul.media li:nth-child(2n){margin-right:0;}
.news_pic {width: 40%;float: left;margin-right: 10%;}
.news_date, .news_media, .news_tit {width: 50%;float: right;color: #000;font-weight: 400;line-height: 22px;}
.news_date{margin-bottom:10px;}
.news_media {color:#ff0068}
/* event page */
#event{padding-top:1%}
#event.inner{padding-bottom:0}
#event h1{color: #FF0068;margin-bottom:3%;}
#event h2{padding-top:0}
dl.event{overflow:hidden; margin-top:0; margin-bottom:60px; line-height:1.6em;text-align:left}
dl.event>dt{float:left;padding: 20px 0; width: 10em;font-weight:bold;}
dl.event>dd{border-bottom: 1px dashed #000;padding: 20px 0 20px 10em;}
ul.dic{margin-left:20px;}
ul.dic li:before {content: '';width: 3px;height: 3px;display: inline-block;border-radius: 100%;background: #000000;position: relative;left: -10px;top: -3px;}
table.schedule {width:100%; max-width:600px; margin-top:20px;}
.fee h2{max-width:720px; margin-bottom:10px}
.fee h2 img{margin-left:0}
table.fee{width:100%; max-width:600px; }
table.schedule tr, table.fee tr{border-bottom:none}
table.schedule tr th,  table.schedule tr td{font-weight:normal;padding:4px 0; text-align:left}
table.schedule tr th{padding-right:20px;}
table.fee tr td{border: solid 1px #999; font-weight:normal;padding:4px; text-align:left }
table.fee tr th{color:#fff;padding:4px; text-align:left;font-weight:bold; letter-spacing:1px}
table.fee tr td:nth-child(2){white-space: nowrap;  width:100px;text-align:right; vertical-align:bottom}
table.pk{margin-top:0 !important}
table.bl th{background-color:#8eb5e0; border: solid 1px #8eb5e0; }
table.bl tr td{border-top: solid 1px #8eb5e0;border-left: solid 1px #8eb5e0;border-right: solid 1px #8eb5e0; border-bottom:none;}
table.pk th{background-color:#fd88cd; border: solid 1px #fd88cd;}
table.pk tr td{border: solid 1px #fd88cd;}
.gmap a {cursor:pointer; display:block;}
.map img{width:100%; max-width:600px}
.entry {clear:both; overflow:hidden; }
.entry h2{text-align:center;color:#e51711; font-size:18px;font-weight:bold; letter-spacing:1px; margin-bottom:20px; line-height:1.6em}
ul.ent_app {margin-top:20px;margin-bottom:40px;}
ul.ent_app li{width:199px;display:inline-block;margin:0 10px;margin-bottom:10px;}
.btn {width: 300px;height: 84px;padding-top: 16px;background-color: #ec6d88;color: #FFF;line-height: 34px;font-size: 21px;text-align: center;margin: 0 auto;margin-bottom:50px;text-shadow: 1px 1px 1px rgb(204, 204, 204);-moz-border-radius: 12px;-webkit-border-radius: 12px;border-radius: 12px;}
.btn a {color:#ffffff; display:block}
/* guest */
#guest{clear:both; overflow:hidden; margin-bottom:6%}
.gst_name {padding: 10px 0;letter-spacing: 2px; font-weight: bold; font-size: 22px;text-align:left}
.gst_pic{width: 325px;float: left; margin-right: 1%; vertical-align: top; }
.gst_prf{ text-align:left}
/* followus */
#followus .inner{padding:4% 0; }
.flw_right,.flw_left{width:48%; display:inline-block; text-align:center; vertical-align:middle}
ul.sns_logo li{display:inline-block}
/* footer */
#footer{background-color:#eeeeee; clear:both}
#footer{font-family: 'Oswald','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif; line-height:1em}
#footer .inner{ padding-top:20px;overflow:hidden}
#ft_tit{background-color:#dbdbdb; color:#00a0e2; text-align:center; box-sizing:border-box;padding:2px 10px;font-weight:bold;line-height:1.6em;letter-spacing:4px;font-size:14px;}
#ft_tit .br{margin:0 3%;}
#ft_cont{position:relative;background-color:#eeeeee;clear:both}
#ft_cont,#ft_cont a{color:#00a0e2; font-size:12px; letter-spacing:2px}
#ft_cont .links {margin-bottom:20px}
#ft_cont .links li,#ft_cont .links li a{color:#999999; }
#ft_cont .links li{display:inline-block; border:solid 2px #c1c1c1;letter-spacing:1px;margin:0 3px; margin-bottom:10px;vertical-align:bottom;padding:4px 6px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#ft_cont .app .txt{display:inline-block;color:#666;font-weight:bold;border:solid 2px #999; margin-bottom:10px;vertical-align:bottom;padding:4px 10px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
#ft_cont ul.ent_app{margin-top:10px;margin-bottom:30px;}
#ft_cont ul.ent_app li{width:160px;display:inline-block;margin:0 5px;margin-bottom:10px;}
#ft_cont .contact {margin:0 auto;margin-bottom:50px;text-align:center;;font-weight:bold;}
#ft_cont .contact a{position:relative}
#ft_cont .contact a:after {content: ' ';position: absolute;right: -14px;top: 5px;width: 0px;height: 0px;border-top: 5px solid rgba(0, 0, 0, 0);border-bottom: 5px solid rgba(0, 0, 0, 0);border-left: 8px solid #00a0e2;border-right: 0px solid rgba(0, 0, 0, 0);}
#ft_cont{position:relative}
#ft_logo img{ display: block;margin:0 auto }
#ft_logo .logo_line{height:34px; width:100%; background-color:#00a0e2;text-align:center}
@media (max-width:1000px){
.inner{position:relative; width:94%; }
}
@media (max-width:767px){
h1{font-size:34px;}
h2{font-size:30px;}
h4{font-size:24px;}
#st_menu h2{font-size:28px;}
#header .lead{margin-right:4%}
/* top page */
ul.sch.flex li,ul.cnt.flex li {width:48%;margin:2% 1%;}
/* review */
ul.instabox{max-width:520px}
/* news */
#news table tr td .date{display:block;}
/* chocostation */
ul.st_menu li{width:100%; margin:0; margin-bottom:1.4%;}
/*ul.st_menu.flavor li,ul.st_menu.drink li,ul.st_menu.bakedsweets li{width:49.4%; margin:0 0.3%; margin-bottom:1.4%}*/
ul.st_item li{width:48%; margin:0 1%; margin-bottom:4%}
/* sns */
/* special contents */
ul.spcnt{max-width:429px;}
ul.spcnt li{width:100%;}
ul.spcnt >:first-child > div {margin-bottom:22%}
ul.spcnt >:first-child .point{width:41%}
/* flow */
.section .contents p {-webkit-box-shadow:14px 14px 0px 0px #000000;box-shadow:14px 14px 0px 0px #000000;-moz-border-radius: 8px;  -webkit-border-radius: 8px;  border-radius: 8px;}
.section .contents p{padding:4%; text-align:left}
.section .contents .inner{width:92%;}
/* event */
dl.event>dt{float:none;padding: 20px 0 16px 0; width: 100%;}
dl.event>dd{padding: 0 0 30px 0;}
}
@media (min-width:768px){
.sfont {font-size:16px;}
ul.flex img.split {width:49%; margin-bottom:0.8%;display:inline-block;}
ul.flex img.split:nth-child(2n){margin-left:0.4%;}
}

@media (min-width:599px){
.overlay {display:none !important;}
}
@media (max-width:600px){
ul.instabox{max-width:348px}
}
@media (max-width:480px){
h1{font-size:32px;}
h2{font-size:28px;}
#st_menu h2{font-size:26px;}
#top .top_logo{position:absolute; top:16%; left:0; right:0;margin:auto}
/* contents */
ul.cnt li .clickguid{width:60%}
/* news */
#news table tr td{padding:0 4% 2% 4%; }
ul.sch.flex{flex-direction: column;}
ul.sch.flex li{width: 98%;margin:1% auto;}
/* special contents */
ul.spcnt li .point{bottom:-60px;}
ul.spcnt li .detail{width:100px;padding:6px 40px 6px 20px;}
/* guest */
.gst_pic{float:none; clear:both;}
/* flow page */
#container.flow #top img.board{padding:30px 0;width:60%; max-width:400px; margin:0 auto}
#container.flow #top img.girls{position:relative; width:90%; top:0; right:0;left:0; bottom:0; }
.section .contents {padding-top:30px}
.section .contents h3{margin-bottom:26px}
.section .contents p {-webkit-box-shadow:10px 10px 0px 0px #000000;box-shadow:10px 10px 0px 0px #000000;}
/* media page */
ul.media li{float: none;clear:both;width: 100%;margin-right: 0;}
}
@media (max-width:360px){
ul.instabox{max-width:172px}
}
/* page top */
#pagetopbutton {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 15px;
}
#pagetopbutton a {
  display: block;
  z-index: 999;
  padding: 6px 8px 8px 8px;
  border-radius: 30px;
  width: 35px;
  height: 35px;
  background-color: #EA333E;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
}
#pagetopbutton a:hover {
    display: block;
    background-color: #b2d1fb;
    text-align: center;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    padding:5px 10px;
  filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}