@charset "utf-8";
/*
GLOBAL
***************************************************************************/
body {
width: 100%;
height: auto;
font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
text-align: left;
font-size: 12px;
color: #333;
line-height: 1.5;
background: #fff;
-webkit-text-size-adjust: none;
}
img { border:none; max-width:100%; height:auto; vertical-align:bottom; /* ie8 */}
a:hover img { opacity:0.7;filter: alpha(opacity=70);-ms-filter: "alpha( opacity=70 )"; }
/*
DEFAULT
***************************************************************************/
body,
h1,h2,h3,h4,h5,h6,p,
ul,ol,li,dl,dt,dd,
form,fieldset,legend,pre,blockquote,
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,video {
margin: 0;
padding: 0;
}
h1 { width:100%; margin:0 auto; }
h2 { width:100%; text-align:center; margin:20px 0; padding:2px 0; font-size:4em; line-height:1.3;}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,video {
display:block;
}
p { word-wrap: break-word; text-align: justify; }
.clearfix:after {
display: block;
clear: both;
content: "";
overflow: hidden;
}
li {
list-style-type: none;
}
table {
width: 100%;
text-align: left;
border-collapse: collapse;
}
/* ▼LINK▼ */
a {
color: #333;
text-decoration: underline;
outline: none;
}
a:hover {
text-decoration: none;
}
/* ▼IMG▼ */
img, input[type="image"]{
vertical-align: middle;
font-size: 0;
line-height: 0;
border: 0;
transition-duration: 1s;
}
/*
a:hover img, input[type="image"]:hover {
filter: alpha(opacity=100);
opacity: 1;
}
*/
a.no_filter:hover,
.no_filter a:hover,
a.no_filter:hover img,
input[type="image"].no_filter:hover,
.no_filter a:hover img,
.no_filter input[type="image"]:hover {
filter: alpha(opacity=100);
opacity: 1;
}
#container {
position: relative;
z-index: 1;
margin:0;
width:100%;
text-align: center;
}
.base_box {
width: 1000px;
margin:0 auto;
}
.box { margin:0 auto; width: 1000px; padding:0; text-align:center; }
.position { position: relative;}
.w780 { width:780px; margin:0 auto; padding:0;}
.w781 { width:781px; margin:0 auto; padding:0;}
.w779 { width:779px; margin:0 auto; padding:0;}
.w818 { width:818px; margin:0 auto; padding:0; background-color:#fff;}
.w814 { width:814px; margin:0 auto; padding:0; background-color:#fff;}
.icon-box { width:100%; box-sizing: border-box; border:solid 5px #b93a2c; border-top:none; padding:20px;}
ul.icon-list { list-style: none; width:700px; margin:0; padding:0; text-align: left;}
ul.icon-list li { display:inline-block; vertical-align: middle; margin:0; padding:0;}
ul.icon-list li:first-child { width:50px; margin:0 20px 0 0;}
ul.icon-list li:last-child { font-weight:bold; font-size:1.2rem; line-height: 1.4;}
ul.icon-list li.one { font-weight:bold; font-size:1.5rem; line-height: 1.2;}
.bg-ladys { background-color:#b93a2c; margin:0 auto; padding:0;}
hr.ladys { border-style: none; border-top: 6px solid #ee87b4; margin:20px auto; width:780px; padding:0;}
hr.ladysmens { border-style: none; border-top: 6px solid #796baf; margin:20px auto; width:780px; padding:0;}
hr.kids { border-style: none; border-top: 6px solid #e8374a; margin:20px auto; width:780px; padding:0;}
hr.goods { border-style: none; border-top: 6px solid #1a9f3c; margin:20px auto; width:780px; padding:0;}
hr.zakka { border-style: none; border-top: 6px solid #734b23; margin:20px auto; width:780px; padding:0;}
hr.foods { border-style: none; border-top: 6px solid #fbc400; margin:20px auto; width:780px; padding:0;}
hr.cafe { border-style: none; border-top: 6px solid #cbae3a; margin:20px auto; width:780px; padding:0;}
hr.service { border-style: none; border-top: 6px solid #00b9ef; margin:20px auto; width:780px; padding:0;}
.mpt250 { margin-top:-205px; padding-top:205px;}
.mpt500 { margin-top:-305px; padding-top:305px;}
.pb200 { padding-bottom:200px;}
.mt300 { margin-top:250px;}
.border { border-top:2px solid #333;}
/*
FOOTER
***************************************************************************/
.copy { width:100%; background-color:#e8e8e8; height:4em; color:#333; line-height:4em; text-align:center; margin:0; clear:both; }
.totopfl { width:100%; border-bottom:solid 1px #ccc; border-top:solid 1px #ccc;}
.totop { width:900px; margin:0 auto; height:3em; line-height:3em; text-align:right; font-size:1.2em; }
.totop a:link { color:#C00; text-decoration:none; }
header { margin:0 auto; width:100%; }
footer {
width:900px;
margin:20px auto 0 auto;
padding: 0 0 0 0;
font-size: 10px;
background-color:#fff;
color: #333;
text-align:left;
clear:both;
}
/*
COMMON PARTS
***************************************************************************/
/* ▼display▼ */
.block { display:block!important; }
.inline { display:inline!important; }
.posit_r { position:relative!important; }
.posit_a { position:absolute!important; }
.posit_f { position:fixed!important; }
.align_c { text-align:center!important; }
.align_r { text-align:right!important; }
.align_l { text-align:left!important; }
.align_j { text-align:justify!important; }
.disp_l { width:100%; text-align:left; padding:0;}
.disp_l img { width:18%; display:inline-block; margin:10px 0;}
.disp_r { float:right!important; width:50%; text-align:right; }
.disp_r img { width:30%; display:inline-block; margin:15px 0 0 0;}
/* ▼area▼ */
.mb100 { margin-bottom:100px!important; }
.mb95 { margin-bottom:95px!important; }
.mb90 { margin-bottom:90px!important; }
.mb80 { margin-bottom:80px!important; }
.mb75 { margin-bottom:75px!important; }
.mb70 { margin-bottom:70px!important; }
.mb65 { margin-bottom:65px!important; }
.mb60 { margin-bottom:60px!important; }
.mb55 { margin-bottom:55px!important; }
.mb50 { margin-bottom:50px!important; }
.mb48 { margin-bottom:48px!important; }
.mb45 { margin-bottom:45px!important; }
.mb40 { margin-bottom:40px!important; }
.mb36 { margin-bottom:36px!important; }
.mb35 { margin-bottom:35px!important; }
.mb30 { margin-bottom:30px!important; }
.mb25 { margin-bottom:25px!important; }
.mb24 { margin-bottom:24px!important; }
.mb20 { margin-bottom:20px!important; }
.mb15 { margin-bottom:15px!important; }
.mb12 { margin-bottom:12px!important; }
.mb10 { margin-bottom:10px!important; }
.mb8 { margin-bottom:8px!important; }
.mb5 { margin-bottom:5px!important; }
.mlr115 { margin-left:115px!important; margin-right:115px!important; }
.mlr75 { margin-left:75px!important; margin-right:75px!important; }
.mlr70 { margin-left:70px!important; margin-right:70px!important; }
.mlr60 { margin-left:60px!important; margin-right:60px!important; }
.mlr55 { margin-left:55px!important; margin-right:55px!important; }
.mlr50 { margin-left:50px!important; margin-right:50px!important; }
.mlr45 { margin-left:40px!important; margin-right:45px!important; }
.mlr40 { margin-left:40px!important; margin-right:40px!important; }
.mlr35 { margin-left:35px!important; margin-right:35px!important; }
.mlr30 { margin-left:30px!important; margin-right:30px!important; }
.mlr25 { margin-left:25px!important; margin-right:25px!important; }
.mlr20 { margin-left:20px!important; margin-right:20px!important; }
.mlr15 { margin-left:15px!important; margin-right:15px!important; }
.mlr10 { margin-left:10px!important; margin-right:10px!important; }
.mlr5 { margin-left:5px!important; margin-right:5px!important; }
.mlr-1 { margin-left:-1px!important; margin-right:-1px!important; }
.mlr-5 { margin-left:-5px!important; margin-right:-5px!important; }
.mlr-10 { margin-left:-10px!important; margin-right:-10px!important; }
.mlr-20 { margin-left:-20px!important; margin-right:-20px!important; }
.mt250 { margin-top:250px!important; }
.mt200 { margin-top:200px!important; }
.mt150 { margin-top:150px!important; }
.mt100 { margin-top:100px!important; }
.mt80 { margin-top:80px!important; }
.mt80s { margin-top:80px!important; }
.mt70 { margin-top:70px!important; }
.mt60 { margin-top:60px!important; }
.mt50 { margin-top:50px!important; }
.mt40 { margin-top:40px!important; }
.mt30 { margin-top:30px!important; }
.mt20 { margin-top:20px!important; }
.mt15 { margin-top:15px!important; }
.mt10 { margin-top:10px!important; }
.mt5 { margin-top:5px!important; }
.mt3 { margin-top:3px!important; }
.mt0 { margin-top:0!important; }
.mt-5 { margin-top:-5px!important; }
.mt-10 { margin-top:-10px!important; }
.mt-20 { margin-top:-20px!important; }
.mt-40 { margin-top:-40px!important; }
.mt-50 { margin-top:-50px!important; }
.mt-80 { margin-top:-80px!important; }
.mt-100 { margin-top:-100px!important; }
.tm40 { margin-top:40px; }
.pt60 { padding-top:60px!important;}
.pb50 { padding-bottom:50px!important; }
.pb25 { padding-bottom:25px!important; }
.pb8 { padding-bottom:8px!important; }
.pb0 { padding-bottom:0!important; }
.p20 { padding:20px!important; }
.p15 { padding:15px!important; }
.p10 { padding:10px!important; }
.pt80 { padding-top:80px!important; }
.pt30 { padding-top:30px!important; }
.ptb40 { padding-top:40px!important; padding-bottom:40px!important; }
.ptb20 { padding-top:20px!important; padding-bottom:20px!important; }
.ptb15 { padding-top:15px!important; padding-bottom:15px!important; }
.ptb5 { padding-top:5px!important; padding-bottom:5px!important; }
.plr25 { padding-left:25px!important; padding-right:25px!important; }
.cap { font-size:0.9em; line-height:1.3; padding:10px 0 40px 0; width:615px; margin:0 auto; text-align:left;}
.pc { display:block; margin:0 auto; padding:0; }
.sp { display:none; }
.sp-body { background-image:url("../images/sp-bg-2.jpg"); background-size: 100%; background-repeat:repeat-y; background-position:top center; width:100%; margin:0; padding:0; text-align:center; }
.sp-body ul { list-style:none; }
.sp-body ul li { width:80%; margin:1% auto; }
/* ▼link▼ */
a.line, .line { text-decoration:underline!important; }
a.no_line { text-decoration:none!important; }
.toggle { display:none; }
.spmenu { display:none; }
ul.ft-logo { list-style:none; width:810px; margin:20px auto; text-align:center; }
ul.ft-logo li { width:180px; display:inline-block; margin:0 40px 0 0; vertical-align: middle;}
ul.ft-logo li:last-child { width:300px; display:inline-block; margin:0 0 0 0; vertical-align: middle;}
ul.ft-logo li img { width:100%; }
div#floating-menu {
display:block;
position: fixed;
bottom: 20px;
right: 20px;
z-index: 1;
}
.kaimono {
display:block;
position: fixed;
bottom: 20px;
z-index: 1;
width:100%;
pointer-events: none;
}
div#floating-yoyaku {
display:absolute;
max-width:1350px;
min-width:1300px;
text-align:right;
margin:0 auto;
}
div#floating-yoyaku img { width:160px;; margin:0; text-align:right; pointer-events: auto;}
#slide_menu { display:none;}
.spmenu { display:none;}
.w3 { width:20%; height:auto; }
.w7 { width:7%; }
.w70 { width:68%; }
.w60 { width:58%; }
.w50 { width:48%; }
.w40 { width:38%; }
.w30 { width:28%; }
.w500 { width:500px!important; margin:0 auto;}
.w550 { width:550px; text-align:right;}
.w280 { width:280px; }
.w300 { width:300px; }
.w615 { width:615px; margin:30px auto;}
hr { height:0; margin:40px auto; width:900px; border:solid 1px #ccc;}
ul.submenu { width:866px; margin:0 auto; list-style:none; }
ul.submenu li:first-child { float:left; margin:0; padding:0; }
ul.submenu li:last-child { float:right; margin:0; padding:0; }
.bnr { margin:20px auto; width:100%; text-align:center; }
.shop { width:938px; margin:20px auto;}
.btn { position:absolute; bottom:25px; left:45px; }
.txt { width:938px; margin:0 auto; font-size:0.85em; line-height:1.3; text-align:left; }
.bt { text-align:left; width:780px; margin:20px auto; }
.smtxt { font-size:1.2em;}
p.b01 { font-size:1.45em; line-height:1.5; text-align:center; }
.reg { font-size:0.7em;}
.redbold { font-weight:bold; color:#C00; }
.bold { font-weight:bold!important; }
.ss { font-size:1.1em; line-height:1.5; text-align:left;}
.ttl { text-align:center; font-size:1.5em; line-height:1.5; font-weight:bold; }
.orange { color:#F33; }
ul.shisetsu { list-style:none; width:915px; margin:0 auto; text-align:center; }
ul.shisetsu li { display:inline-block; width:32%; margin:0 2% 2% 0;}
ul.shisetsu li:nth-child(3n) { margin:0 0 2% 0;}
.b-border { border-top:20px solid #0068b7; width:1000px; margin:0 auto; }
.b-border2 { border-top:10px solid #6ba9be; }
.bg-500 { background-color:#004f94;}
.dec { background-color:#8acfd2; padding:25px 0; }
.mov { width:600px; margin:0 auto; }
.yt-fr { background-image:url("../images/xmas-mov_2.png"); background-repeat:no-repeat; background-position:top left; padding:0 30px; height:335px; }
.yt {
width: 100%;
height: 0;
position: relative;
padding-top: 56.25%;
overflow: hidden;
border:1px solid #666;
}
.yt iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
#footer {
width:900px;
padding:20px 10px;
background-color:#FFF;
color: #333;
margin:20px auto;
clear:both;
position:static;
}
ul.ft_menu { width:800px; text-align:center; margin:0 auto; }
ul.ft_menu li { font-size:1.1em; margin:0 1em 1em 0; display:inline-block; padding:0 0.5em; line-height:1.3; vertical-align: middle; text-align: center; }
ul.ft_menu li:first-child { margin:0 1em 1em 0; }
ul.ft_menu li a { text-decoration:none; color:#000;}
/*フッターリンク*/
.copyright { clear:both; width:100%; text-align:center; font-size:0.65em; line-height:1.5; padding:10px 0; background-color:#a99054; margin:0 auto; color:#FFF; }
p.center { font-size:0.8em; line-height:1.3; text-align:center; margin:0 auto; }
.after5 { width:928px; margin:0 auto; }
.after5bg { background-image:url("../images/after5_3.png"); background-repeat:repeat-y; background-position:top left; }
.after5bg { background-image:url("../images/after5_5.png"); background-repeat:no-repeat; background-position:bottom left; }
.stamp { width:918px; margin:0 auto; }
.stampbg { background-image:url("../images/stamp_3.png"); background-repeat:repeat-y; background-position:top left; }
.blackbg { background-color:#000; }
.graybg { background-color:#EFEFEF;}
.yellow { background-color:#F5CD00;}
.ctr { text-align: center;}
.green { color:#467f41; }
.b-w { border:2px solid #f2f4e0; padding:25px; border-radius:10px; width:840px; margin:0 auto; }
.flame-body { background-image: url("../images/frame-2.png"); background-repeat: repeat-y; background-position: top center; }
ul.m-list { width:845px; margin:0 auto; list-style: none; }
ul.m-list li { width:354px; display:inline-block; margin:0 25px 25px 0; background-color:#fff; padding:28px;}
ul.m-list li.one { width:354px; display:inline-block; margin:0 0 25px 0; background-color:#fff; padding:28px;}
ul.m-list li:nth-child(2) { margin:0 0 25px 0; }
.wht { color:#fff;}
.floating-menu { display:none;}
.bg-bw { background-color: #231815;}
.txt-y { color:#fff100;}
.txt-red { color:#e60012;}
.txt-red2 { color:#e61673;}
.txt-gr { color:#489f9d;}
.txt-bl { color:#002855;}
.txt-bl2 { color:#0068b7;}
.subttl-y { color:#fff100; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r { color:#e60012; font-size:2.7rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r2 { color:#e60012; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r3 { color:#e61673; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r4 { color:#c11920; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r5 { color:#a40b5d; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-gr { color:#00a29a; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-gr2 { color:#489f9d; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-gr3 { color:#13ae67; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-bl { color:#002855; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-bl2 { color:#004e85; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.small0 { font-size:0.9rem;}
.small1 { font-size:1rem;}
.small2 { font-size:1.1rem;}
.large0 { font-size:1.2rem;}
.large10 { font-size:1.5rem;}
.large15 { font-size:2rem;}
.large20 { font-size:3rem;}
.bd-btm { border-bottom:dashed 2px #fff; padding:5px;}
.bd-btm1 { border-bottom:solid 3px #000; padding:5px;}
.obi-red { background-color:#e60012; padding:15px 3em 8px 3em; text-align: center; color:#fff100; font-weight:bold; font-size:1.3rem;}
.obi-blk { background-color:#000; padding:15px 3em 8px 3em; text-align: center; color:#fff100; font-weight:bold; font-size:1.3rem;}
.obi-ppl { background-color:#601986; padding:15px 0; text-align: center; color:#fff; font-weight:bold; font-size:1.5rem;}
ul.w-list { list-style: none; margin:0 auto; padding:0; }
ul.w-list li { font-size:1.1em; line-height: 1.3; text-align: left; text-indent:-1em; padding-left:1em; }
.w450 { width:450px; margin:0 auto; }
.paper { width:880px; margin:0 auto; background-image: url("../images/frame-02.png"); background-repeat: repeat-y; background-position: top center;}
.bg-gold { background-color: #aa8e4c; width:746px; margin:0 auto;}
.w746 { width:746px; margin:0 auto;}
.w746sp { width:746px; margin:0 auto;}
ul.detail { width:746px; margin:0 auto; list-style: none; }
ul.detail li:nth-child(odd) { width:175px; margin:0 15px 10px 0; background-color:#fff; border-radius:5px; display:inline-block; padding:5px 0; text-align: center; font-size:1.2rem; font-weight: bold; vertical-align: middle;}
ul.detail li:nth-child(even) { width:556px; margin:0 0 10px 0; display:inline-block; font-weight:bold; color:#fff; font-size:1.7rem; text-align: left; vertical-align: middle;}
ul.detail li.s-txt { font-size:1.3rem; line-height: 1.3; vertical-align: top!important;}
ul.detail3 { width:746px; margin:0 auto; list-style: none; }
ul.detail3 li:nth-child(odd) { width:175px; margin:0 15px 0 0; background-color:#fff; border-radius:5px; display:inline-block; padding:5px 0; text-align: center; font-size:1.2rem; font-weight: bold; vertical-align: top;}
ul.detail3 li:nth-child(even) { width:556px; margin:0; display:inline-block; font-weight:bold; color:#fff; font-size:1.7rem; text-align: left; vertical-align: middle;}
ul.detail2 { width:746px; margin:0 auto; list-style: none; }
ul.detail2 li:nth-child(odd) { width:175px; margin:0 15px 10px 0; background-color:#000; border-radius:5px; display:inline-block; padding:5px 0; text-align: center; font-size:1.2rem; font-weight: bold; vertical-align: top; color:#fff;}
ul.detail2 li:nth-child(even) { width:556px; margin:0 0 10px 0;; display:inline-block; font-weight:bold; color:#000; font-size:1.7rem; text-align: left; vertical-align: middle;}
ul.num { list-style: none; margin:0 auto; padding:0; }
ul.num li { font-size:1.2rem; line-height: 1.3; text-align: left; text-indent:-1em; padding-left:1em; color:#000; margin:0 0 5px 0; font-weight:bold;}
ul.num li::first-letter { color:#e60012; font-size:1.3rem; padding:0 3px 0 0;}
ul.hikikae { list-style: none; margin:0 auto; padding:0; text-align: left;}
ul.hikikae li { font-size:1.2rem; line-height: 1.3; text-align: left; color:#000; margin:0 0 0 0; font-weight:bold; display:inline-block; vertical-align: top;}
ul.hikikae li:first-child::first-letter { color:#e60012; padding:0 3px 0 0;}
ul.hikikae li:first-child { width:10.5em;}
.photo-frame { border:solid 1px #fff; width:744px; margin:0 auto;}
.w880 { width:880px; margin:0 auto; }
.btn1 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(230,9,18,1.0); }
.btn1 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn1 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn1:hover { opacity: 0.7; }
.btn2 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(72,159,157,1.0); }
.btn2 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn2 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn2:hover { opacity: 0.7; }
.btn3 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(230,22,115,1.0); }
.btn3 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn3 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn3:hover { opacity: 0.7; }
.btn4 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(105,141,200,1.0); }
.btn4 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn4 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn4:hover { opacity: 0.7; }
.btn5 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(141,192,232,1.0); }
.btn5 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn5 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn5:hover { opacity: 0.7; }
.btn6 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(193,25,32,1.0); }
.btn6 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn6 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn6:hover { opacity: 0.7; }
.btn7 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(19,174,103,1.0); }
.btn7 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn7 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn7:hover { opacity: 0.7; }
.btn8 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(0,105,52,1.0); }
.btn8 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn8 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn8:hover { opacity: 0.7; }
.btn9 { width:742px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; border:2px solid #fff;}
.btn9 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn9 a::after { content: ">";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 10px;
}
.btn9:hover { opacity: 0.7; }
.btn10 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(96,25,134,1.0); }
.btn10 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn10 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn10:hover { opacity: 0.7; }
.btn11 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(0,104,183,1.0); }
.btn11 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn11 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn11:hover { opacity: 0.7; }
.btn12 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background: linear-gradient(90deg, rgba(156,73,152,1) 0%, rgba(61,98,173,1) 100%); }
.btn12 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn12 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn12:hover { opacity: 0.7; }
.btn13 { width:746px; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(235,109,142,1.0); }
.btn13 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn13 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn13:hover { opacity: 0.7; }
.grd-frame { border: 2px solid #c21500; border-image: linear-gradient(to bottom right, #fdd000 0%, #ea5514 100%); border-image-slice: 1; width:876px; margin:0 auto;}
ul.joken { width:746px; margin:0 auto; list-style: none; text-align: left;}
ul.joken li { font-size:0.9rem; line-height: 1.3; margin:0; color:#fff; text-indent:-1em; margin-left:1em; }
ul.joken li:first-child { font-size:1.1rem; color:#e60012; }
ul.joken1 { width:900px; margin:0 auto; list-style: none; text-align: left; }
ul.joken1 li { font-size:1rem; line-height: 1.3; margin:0; text-indent:-1em; margin-left:1em;}
.w80 { width:80%; }
.w880 { width:880px; height:auto; margin:0 auto;}
.w300 { width:27em; height:auto; margin:0 auto;}
.h-menu { width:900px; margin:0; padding:0; text-align: center; position:relative;}
ul.f-menu { list-style: none; margin:0 auto; text-align:center; padding:0 150px; width:780px; }
ul.f-menu li { display:inline-block; margin:0 12px 12px 0;}
ul.f-menu li:nth-child(3n) { margin:0 0 12px 0; }
#f-map { position: absolute; z-index:9999; padding-bottom:10px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); }
#f-map.fixed {
position: fixed; top: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); z-index:9999; }
/*固定メニュー
.fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 10;
}*/
.w1000 { width:1000px; margin:0 auto; position:relative;}
#item01 { margin-top:-40px; padding-top:40px;}
#item02 { margin-top:-40px; padding-top:40px;}
#item03 { margin-top:-40px; padding-top:40px;}
#item04 { margin-top:-40px; padding-top:40px;}
#item05 { margin-top:-40px; padding-top:40px;}
ul.disp li.disp-right {
display: none;
}
ul.f-menu-sp { display:none;}
/*17th*/
ul.top-logo { list-style: none; margin:0 auto; width:808px; }
ul.top-logo li {display:inline-block; vertical-align: middle;}
ul.top-logo li:first-child { width:378px; text-align: left;}
ul.top-logo li:first-child img { width:358px;}
ul.top-logo li:nth-child(2) { width:61px;}
ul.top-logo li:last-child { width:369px;}
.kv { width:1000px; height:auto; margin:0 auto; padding:0;}
.bg-bw { background-color: #231815;}
.z1 { z-index:9999999; position:relative;}
.w866 { width:866px; margin:0 auto;}
.w740 { width:740px; margin:0 auto;}
.pt695 { padding-top:695px;}
.bd-btm3 { width:22em; padding-bottom:0.05em; margin:0 auto; border-bottom:1px solid #000;}
.bd-tb { padding:40px 0; margin:0 auto; border-bottom:1px solid #000; border-top:1px solid #000;}
.cut1 { position: absolute; top:0; right:0; pointer-events: none;}
.cut2 { position: absolute; top:1160px; right:0; pointer-events: none;}
.cut3 { position: absolute; bottom:0; right:0; pointer-events: none;}
.cut4 { position: absolute; top:1100px; right:0; pointer-events: none;}
.cut5 { position: absolute; bottom:1570px; right:0; pointer-events: none;}
.cut6 { position: absolute; bottom:950px; right:0; pointer-events: none;}
.cut7 { position: absolute; top:1070px; right:0; pointer-events: none;}
.cut8 { position: absolute; bottom:70px; right:0; pointer-events: none;}
.cut9 { position: absolute; top:685px; right:66px; pointer-events: none;}
ul.stecker { width:740px; list-style: none; margin:0 auto; padding:0;}
ul.stecker li { display:inline-block; margin:0; padding:0; vertical-align: top;}
ul.stecker li.blk { width:195px; height: 70px; margin:0 20px 0 0; background-color:#000010; position:relative;}
ul.stecker li.blk div { color:#fff; margin:0; padding:0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:95%;}
ul.stecker li:last-child { width:525px; text-align: left; margin:0; padding:0;}
ul.stecker-2 { width:740px; list-style: none; margin:0 auto; padding:0;}
ul.stecker-2 li { display:inline-block; margin:0; padding:0; vertical-align: top;}
ul.stecker-2 li.blk { width:175px; height: 50px; margin:0 20px 0 0; background-color:#000010; position:relative;}
ul.stecker-2 li.blk div { color:#fff; margin:0; padding:0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:95%;}
ul.stecker-2 li:last-child { width:545px; text-align: left; margin:0; padding:0;}
ul.stecker-3 { width:740px; list-style: none; margin:0 auto; padding:0;}
ul.stecker-3 li { display:inline-block; margin:0; padding:0; vertical-align:middle;}
ul.stecker-3 li.top { display:inline-block; margin:0; padding:0; vertical-align:top;}
ul.stecker-3 li.blk { width:180px; height: 50px; margin:0 20px 0 0; background-color:#000010; position:relative;}
ul.stecker-3 li.blk div { color:#fff; margin:0; padding:0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:95%;}
ul.stecker-3 li:last-child { width:540px; text-align: left; margin:0; padding:0;}
.lh12 { line-height: 1.2;}
.bg-pink { background-color: #f7d3d8;}
.w680 { width:680px; margin:0 auto; padding:0;}
ul.present { list-style: none; width:680px; margin:0 auto; padding:0;}
ul.present li { display: inline-block; margin:0; padding:0; font-size:30px; font-weight:bold;}
ul.present li:first-child { width:86%; text-align: left;}
ul.present li:last-child { width:14%; text-align: right;}
.font14 { font-size:14px;}
.font16 { font-size:16px;}
.font18 { font-size:18px;}
.font20 { font-size:20px;}
.font22 { font-size:22px;}
.font24 { font-size:24px;}
.font26 { font-size:26px;}
.font28 { font-size:28px;}
.font30 { font-size:30px;}
.font32 { font-size:32px;}
.font34 { font-size:34px;}
.font36 { font-size:36px;}
.font38 { font-size:38px;}
.font40 { font-size:40px;}
.font42 { font-size:42px;}
.font44 { font-size:44px;}
.font46 { font-size:46px;}
.font50 { font-size:50px;}
.pb60 { padding-bottom:60px;}
.pb80 { padding-bottom:80px;}
ul.header-logo { list-style: none; margin:10px auto; padding: 0; width:1000px; text-align: center; min-width:1000px;}
ul.header-logo li { display:inline-block; margin:0; width:50%!important; padding:0; text-align: left; vertical-align: middle;}
ul.header-logo li:last-child {text-align:right;}
ul.header-logo li img { width:40%!important;}
ul.header-logo li:last-child img { width:40%!important;}
.font-hankaku {font-feature-settings: "palt";}
.bg-present { background-color:#8aa3d4;}
.bg-campaign { background-color:#f6bba4;}
.bg-event { background-color:#fcd475;}
.w893 { width:893px; margin:0 auto; }
.w807 { width:807px; margin:0 auto; }
.w777 { width:777px; margin:0 auto; }
.bd-wht { background-color:#fff;}
.yk100 { position:absolute; top:-20px; right:0; width:180px; height:auto;}
.btm-gray { border-bottom:2px solid #9fa0a0;}
.icon-event { position:absolute; bottom:0; left:-55px; width:180px; height:auto;}
.txt-j { text-align: justify;}
.pt-10 { padding-top:-20px!important;}
/*スポーツ*/
.w900 { width:900px; margin:0 auto; }
.ptb60 { padding-top:60px!important; padding-bottom:40px!important; }
.bg-red { background-color:#d22d3c;}
.bg-blue { background-color:#033988;}
.bg-wht { background-color:#fff;}
.w778 { width:778px; margin:0 auto; padding:0;}
.w644 { width:644px; margin:0 auto; padding:0;}
.date { width:100%; margin:0 auto; display:flex; justify-content: space-between; }
.date div:first-child { width:22%; color:#fff; margin:0 3% 0 0; font-size:22px;}
.date div:last-child { width:75%; text-align: left; padding:0; color:#fff; font-size:36px;}
.date1 { width:100%; margin:0 auto; display:flex; justify-content: space-between;}
.date1 div:first-child { width:22%; color:#fff; margin:0 3% 0 0; font-size:22px;}
.date1 div:last-child { width:75%; text-align: left; padding:0; color:#003987; font-size:36px;}
.lh13 { line-height: 1.3;}
.f-blue {color:#003987;}
.f-red { color:#ce142c;}
.bd-blue { border-top:2px solid #003987; margin:40px 0;}
.font-w90 { transform: scale(0.9, 1); transform-origin: top left; width: 111%; white-space: nowrap;}
.underline { text-decoration: underline;}
.d1 { position: relative;
z-index: 1;
width:100%;
height:auto!important;
text-align: center;
margin: 0 auto;
padding:0.2em 0;
}
.d1 span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:95%;}
.ht2 { height:2em!important;}
.ht3 { height:3em;}
.noto {
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
font-feature-settings: "palt";
}
.noto-bold {
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal;
font-feature-settings: "palt";
}
/*bs2024*/
ul.attention { list-style: none; }
ul.attention li { text-indent: -1em; padding-left:1em; text-align: left;}
.f-red1 { color:#e60020;}
.f-blk { color:#000;}
.ttl1-parts { position:absolute; top:0; left:0;}
.va-m { vertical-align: middle;}
.w946 { width:946px; margin:0 auto;}
.w835 { width:835px; margin:0 auto;}
.w830 { width:830px; margin:0 auto;}
.w688 { width:688px; margin:0 auto;}
.w710 { width:710px; margin:0 auto;}
ul.event-date { width:830px; list-style: none; margin:0 auto; padding:10px 0; border-top: solid 2px #231815; text-align: left;}
ul.event-date li { display:inline-block; vertical-align: middle; margin:0; text-align: left;}
ul.event-date1 { width:830px; list-style: none; margin:0 auto; padding:10px 0; border-top: solid 2px #231815; border-bottom: solid 2px #231815; text-align: left;}
ul.event-date1 li { display:inline-block; vertical-align: middle; margin:0; text-align: left;}
ul.event-date2 { width:830px; list-style: none; margin:0 auto; padding:10px 0; border-top: solid 2px #231815; text-align: left;}
ul.event-date2 li { display:inline-block; vertical-align: top; margin:0; text-align: left;}
ul.event-date3 { width:830px; list-style: none; margin:0 auto; padding:10px 0; border-top: solid 2px #231815; border-bottom: solid 2px #231815; text-align: left;}
ul.event-date3 li { display:inline-block; vertical-align: top; margin:0; text-align: left;}
.item { width:100%; display: flex; justify-content: space-between; flex-wrap:wrap;}
.item div:first-child { width:50%;}
.item div:last-child { width:45%; text-align: justify;}
.item div:last-child p { margin:0; padding:0; line-height: 1.4;}
.flex-middle { align-items: center!important; }
sup { font-size: 70%; vertical-align: super; white-space: nowrap;}
.ind { padding-left: 1.7em; text-indent: -1.7em; margin-left:1.7em!important;}
.ind1 { padding-left: 1em; text-indent: -1em; margin-left:1em!important;}
/*bf2025*/
.w760 { width:760px; margin:0 auto;}
.font-space {letter-spacing: 0.1em;}
.pt40 { padding-top:40px;}
.ind3 { padding-left: 2em; text-indent: -2em; }
.ind4 { padding-left: 1.5em; text-indent: -1.5em; }
.btn-top { position: fixed; bottom:1%; right:1%; width:60px; height:60px; z-index:999;}
.btn-top img { width:100%; height:auto;}
/*Life with YOKOHAMA*/
.bg-y { background-color:#fefbec; }
.w722 { width:722px; margin:0 auto;}
.w867 { width:867px; margin:0 auto;}
.menu { display: flex; justify-content: space-between; flex-wrap:wrap;}
.menu div { width:237px; }
.menu div:last-child { }
.bg1 { background-image: url("../images/f1-bg-1.png") ; background-repeat: no-repeat; background-position: top center;}
.bg2 { background-image: url("../images/f1-bg-2.png") ; background-repeat: no-repeat; background-position: top center;}
.bg3 { background-image: url("../images/f1-bg-3.png") ; background-repeat: no-repeat; background-position: top center;}
.bg4 { background-image: url("../images/f2-bg-1.png") ; background-repeat: no-repeat; background-position: top center;}
.bg5 { background-image: url("../images/f2-bg-2.png") ; background-repeat: no-repeat; background-position: top center;}
.bg6 { background-image: url("../images/f2-bg-3.png") ; background-repeat: no-repeat; background-position: top center;}
.bg7 { background-image: url("../images/f3-bg-1.png") ; background-repeat: no-repeat; background-position: top center;}
.bg8 { background-image: url("../images/f3-bg-2.png") ; background-repeat: no-repeat; background-position: top center;}
.bg9 { background-image: url("../images/f3-bg-3.png") ; background-repeat: no-repeat; background-position: top center;}
.bg10 { background-image: url("../images/f4-bg-1.png") ; background-repeat: no-repeat; background-position: top center;}
.bg11 { background-image: url("../images/f4-bg-2.png") ; background-repeat: no-repeat; background-position: top center;}
.lh15 { line-height: 1.5;}
.lh18 { line-height: 1.8;}
.lh20 { line-height: 2.0;}
.item-detail { display:flex;}
.item-detail div:first-child { width:417px;}
.item-detail div:last-child { width:583px;}
.item-detail div.item-txt { display:block; width:516px;}
.item7 { position:absolute; top:-70px; left:0;}
/*スライド*/
.sliderArea {
max-width: 867px;
height : auto;
margin: 0 auto;
padding: 0 ;
}
.slick-slide {
margin: 0;
}
.slick-slide img {
width: 100%;
height: auto;
margin-bottom:15px;
}
.slick-prev, .slick-next {
z-index: 1;
}
.slick-prev:before {
color:#ccc;
}
.slick-next:before {
color:#ccc;
}
.slick-slide {
transition: all ease-in-out .3s;
opacity: 1;
}
.slick-active {
opacity: 1;
}
.slick-current {
opacity: 1;
}
.thumb {
margin: 20px 0 0;
}
.thumb .slick-slide {
cursor: pointer;
}
.thumb .slick-slide:hover {
opacity: .7;
}
.slide-arrow {
bottom: 0;
margin: auto;
position: absolute;
top: 0;
}
.prev-arrow {
left: -25px;
}
.next-arrow {
right: -25px;
}
.prev-arrow1 {
left: -25px;
top:-125px;
}
.next-arrow1 {
right: -25px;
top:-125px;
}
@media screen and (max-width: 768px) {
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
body {
font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
-webkit-text-size-adjust: 100%;
min-width: 100%;
}
#container {
position: relative;
background: #fff;
z-index: 1;
width:100%;
}
.base_box {
position: relative;
width: 100%;
margin:0 auto 1% auto;
background-image:none;
}
header { margin:0; }
h1 { width:100%; margin:0; padding:0;}
h2 { width:100%; text-align:center; margin:2% 0; padding:1% 0; font-size:2em; line-height:1.3;}
.card_txt { font-size:1em; line-height:1.8; width:95%; margin:4% auto; text-align:left; }
.back-btn {
display: inline-block;
padding: 1em 2em;
text-decoration: none;
color: #67c5ff;
border: solid 1px #67c5ff;
transition: .4s;
font-size:1.2em;
margin:0 0 3% 0;
}
.back-btn:hover {
background: #67c5ff;
color: white;
cursor:pointer;
}
.back-btn a { text-decoration:none; }
.lego2 { font-size:0.85em; text-align:center; margin:0 0 3% 0; }
.pasmo1 { width:3%; height:auto;}
.pasmo2 { width:4%; height:auto;}
.ft { width:100%; text-align:center; margin:2% auto; }
.check { margin:2% 0; }
ul.link { list-style:none; width:100%; margin:1% auto; text-align:left; }
ul.link li { width:32%; display:inline-block; margin:0 1% 2% 0; }
ul.link li:nth-child(3n) { width:32%; display:inline-block; margin:0 0 2% 0; }
ul.link li.noinline { display:block; }
.mb100 { margin-bottom:3%!important; }
.mb95 { margin-bottom:3%!important; }
.mb90 { margin-bottom:3%!important; }
.mb80 { margin-bottom:3%!important; }
.mb75 { margin-bottom:3%!important; }
.mb70 { margin-bottom:3%!important; }
.mb65 { margin-bottom:2%!important; }
.mb60 { margin-bottom:2%!important; }
.mb55 { margin-bottom:2%!important; }
.mb50 { margin-bottom:2%!important; }
.mb40 { margin-bottom:4%!important; }
.mb20 { margin-bottom:4%!important; }
.pt60 { padding-top:6%!important; }
.mt250 { margin-top:2%!important; }
.mt200 { margin-top:2%!important; }
.mt150 { margin-top:15%!important; }
.mt100 { margin-top:10%!important; }
.mt70 { margin-top:2%!important; }
.mt60 { margin-top:6%!important; }
.mt50 { margin-top:2%!important; }
.mt30 { margin-top:2%!important; }
.ml30 { margin:0 auto!important; }
.mr-50 { margin:0 auto!important; }
.mr50 { margin:0 auto!important; }
.mr30 { margin:0 auto!important; }
.mt-1 { line-height: 0px!important; }
.mt-10 { margin-top:0!important; }
.mt-20 { margin-top:-2%!important; }
.mt-40 { margin-top:-5%!important; }
.mt-50 { margin-top:0!important; }
.mt-100 { margin-top:0!important; }
.sp100 { margin-top: 5%;}
.pb50 { padding-bottom:5%!important; }
.top_box1000 {
position: relative;
margin:0 auto;
width:100%;
background-color:#FFF;
padding:2% 0 0 0;
}
.totop { width:95%; margin:0 auto; height:3em; line-height:3em; text-align:right; font-size:1.2em; }
.totop a:link { color:#C00; text-decoration:none; }
/*
SOCIAL
***************************************************************************/
.social_box {
padding: 9px 0 12px;
background-color:#e6e6e6;
}
.social_list {
font-size:0;
text-align: right;
vertical-align: middle;
margin:0;
width:100%;
}
.social_list li {
display: inline-block;
margin-left: 1%;
vertical-align:top;
}
.social_list li.facebook {
vertical-align: top;
}
.social_list li.line1 {
vertical-align: top;
}
.social_list li.line1 span {
vertical-align: top;
}
ul.gnavi { list-style:none; margin:2% auto; width:98%; }
ul.gnavi li { width:49%; float:left; margin:0 2% 2% 0; }
ul.gnavi li:nth-child(2n) { width:49%; float:left; margin:0 0 2% 0; }
#footer {
padding:2%;
background-color:#fff;
color: #333;
width:100%;
margin:0 auto;
clear:both;
}
ul.ft_menu { width:100%; text-align:center; margin:2% auto; }
ul.ft_menu li { font-size:1.2em; margin:1% 1% 2%; display:inline; text-align:center; width:49%; padding:0;}
ul.ft_menu li a { text-decoration:none; }
ul.ft_menu li:nth-child(5) { font-size:1.2em; margin:1% 1% 2%;}
ul.ft_menu li:nth-child(2n) { font-size:1.2em; margin:1% 0 2%; display:inline; text-align:center; }
ul.ft_menu { width:100%; text-align:center; margin:2% auto; }
ul.ft_menu li { font-size:1.2em; margin:2% 2% 1% 0; float:left; padding-right:1em; border-right:1px solid #333; display:block; }
ul.ft_menu li a { text-decoration:none; }
ul.ft_menu li:nth-child(1) { margin:2% 0 1% 0; float:left; padding-right:1em; border-right:1px solid #333; text-align:right; }
ul.ft_menu li:nth-child(2) { margin:2% 0 1% 1em; padding-right:1em; border-right:none; width:45%; text-align:left; }
ul.ft_menu li:nth-child(3) { margin:0 0 1% 0; width:100%; text-align:center; padding-right:1em; border-right:none;}
ul.ft_menu li:nth-child(4) { margin:0 0 1% 0; width:100%; text-align:center; padding-right:1em; border-right:none;}
ul.ft_menu li:nth-child(5) { margin:0 0 1% 0; width:100%; text-align:center; padding-right:1em; border-right:none; }
ul.ft_menu li:nth-child(6) { margin:0 0 1% 0; width:100%; text-align:center; padding-right:1em; border-right:none; }
ul.ft_menu li:nth-child(7) { margin:0 0 1% 0; width:100%; text-align:center; padding-right:0; border-right:none; }
ul.ft_menu li:nth-child(8) { margin:0 0 1% 0; width:100%; text-align:center; padding-right:0; border-right:none; }
ul.ft-logo { list-style:none; width:90%; margin:2% auto; text-align:center; }
ul.ft-logo li { width:45%; display:inline-block; margin:0 5% 0 0; vertical-align: middle;}
ul.ft-logo li:nth-child(2) { width:50%; display:inline-block; margin:0 0 0 0; vertical-align: middle;}
ul.ft-logo li img { width:75%; }
ul.ft-logo li:last-child img { width:100%; }
.disp_l { width:100%; text-align:left; }
.disp_l img { width:30%; display:inline-block; margin:0 0 0 3%; padding:1%;}
.disp_r { float:right!important; width:50%; text-align:right;}
.disp_r img { width:30%; display:inline-block; margin:1% 0 0 0;}
p.center { font-size:0.8em; line-height:1.3; text-align:center; margin:2% auto; }
div#floating-menu {
display:block;
position: fixed;
bottom: 20px;
right: 20px;
z-index: 9999;
}
div#floating-menu-pc {
display:none;
}
.test {
display:none;
}
.caution { width:100%; margin:2% auto 1% auto; background-color:#1163aa; color:#FFF; text-align:center; font-size:1.3em; font-weight:bold; padding:2% 0; }
.ind { text-align:left; }
.bnr-box { width:98%; margin:2% auto; background-color:#f3f1e2; text-align:center; padding:2% 0; }
.mt10 { margin-top:1%!important; }
.cap { font-size:0.9em; line-height:1.3; padding:2% 0 4% 0; width:95%; margin:0 auto; text-align:left;}
.pc { display:none; }
.sp { display:block; margin:0; padding:0; }
#slide_menu { display:none; width:100%; background-color:#FFF; padding:0; border-top:1px solid #ccc; }
#slide_menu ul { list-style:none; background-color:#FFF; }
#slide_menu ul li { width:50%; height:3em; margin:0; float:left; text-align:center; padding:0; border-right:1px solid #ccc; border-bottom:1px solid #ccc; z-index:9999; position:relative;}
#slide_menu ul li:nth-child(2n) { border-right:none; }
#slide_menu ul li a { display:block; height:3em; text-decoration:none; line-height:3em;}
.spmenu { display:block; height:auto; width:100%;text-align:right; padding:0; }
ul.mainmenu { list-style:none; margin:3% auto; width:100%; text-align:center; }
ul.mainmenu li { display:inline-block; margin:0 4% 4% 0; padding:0; width:48%;}
ul.mainmenu li:nth-child(2) { display:inline-block; margin:0 0 4% 0; padding:0;}
ul.mainmenu li:last-child { margin:0; padding:0; }
.box { width:100%; margin:0 auto; }
.lead { width:100%; font-size:1.3em; line-height:1.5; text-align:center; margin:2% auto;}
.w70 { width:90%; margin:0 auto; }
.w60 { width:90%; margin:0 auto; }
.w50 { width:90%; margin:0 auto; }
.w40 { width:90%; margin:0 auto; }
.w30 { width:90%; margin:0 auto; }
.w500 { width:90%!important; margin:0 auto; }
.w550 { width:90%; margin:0 auto; }
.w280 { width:90%; margin:0 auto; }
.w300 { width:190%; margin:0 auto; }
.w615 { width:95%; margin:2% auto; }
.w615 p { text-align:left;}
.w95 { width:95%; height:auto; margin:0 auto;}
.w9 { width:90%; height:auto; margin:0 auto; }
.w8 { width:80%; height:auto; }
.w7 { width:12%; }
.w7sp { width:70%; height:auto; margin:0 auto; }
.w6 { width:60%; height:auto; margin:0 auto; }
.w5 { width:50%; height:auto; }
.w4 { width:40%; height:auto; }
.w3 { width:30%; height:auto; }
hr { height:0; margin:2% auto; width:95%; border:solid 1px #333;}
ul.main-navi { width:100%; margin:0 auto; }
ul.main-navi li { width:49%; heigh:auto; margin:0; padding:0; float:left; }
ul.main-navi li:nth-child(odd) { margin:0 2% 0 0; }
.hide01 { display:none; }
.posi-ab { position:relative; }
.ov01:hover .hide01 { display:none; }
.hide01 img { opacity: 0.7; }
.hide01:hover a img {
transition: opacity 0.3s ease-out;
}
.ov { overflow: visible; width: 100%; height: 100%; }
.ov img { display: block; transition-duration: 0.5s; }
.ov img:hover { transform: none; }
.schedule { margin:30px auto; text-align:center; width:100%; }
p { font-size:0.9rem; line-height:1.5; text-align:left; }
p.b01 { font-size:1.25em; line-height:1.5; text-align:center; }
.reg { font-size:0.7em;}
.redbold { font-weight:bold; color:#C00; }
.bold { font-weight:bold!important; }
ul.entry { list-style:none; width:100%; margin:0 auto; }
ul.entry li { width:60%; border:solid 8px #009DDA; border-radius:16px; overflow:hidden; padding:2%; float:none; margin:0 auto 25px auto; position:relative; }
ul.entry li:nth-child(3) { margin:0 auto; }
ul.entry li div { height:auto; }
ul.entry li::after { content: "▲"; display:block; position:absolute; right:45%; top:102%; font-size:1.5em; color:#009DDA; transform: rotate(180deg)}
ul.entry li:nth-child(3)::after { content: ""; }
ul.shisetsu { list-style:none; width:95%; margin:0 auto; text-align:center; }
ul.shisetsu li { display:inline-block; width:49%; margin:0 1% 1% 0;}
ul.shisetsu li:nth-child(3n) { margin:0 1% 1% 0;}
ul.shisetsu li:nth-child(2n) { margin:0 0 1% 0;}
.caption { width:100%; padding:0; margin:0; }
ul.btm { list-style:none; margin:0 0 10px 0; }
ul.btm li { font-size:0.85em; text-indent:-1em; margin-left:1em; word-wrap: break-word; width:95%; }
.lego01 { font-size:0.85em; text-align:left; margin:0;}
.bt { text-align:left; width:95%; margin:0 auto; }
/*
ul.ft-logo { list-style:none; width:70%; margin:4% auto; }
ul.ft-logo li { width:40%; display:inline-block; margin:0 10% 2% 0; vertical-align: middle;}
ul.ft-logo li:nth-child(3) { width:40%; display:inline-block; margin:0 0 0 0; }
*/
.mov { width:95%; margin:20px auto; padding-bottom:20px; }
.b-border { border-top:10px solid #0068b7; width:100%;}
.ttl { text-align:center; font-size:1.5em; line-height:1.5; font-weight:bold; margin:3% auto; }
.sp-l { text-align:left; }
.yt-fr { background-image:url("../images/xmas-mov_2.png"); background-repeat:no-repeat; background-position:top left; padding:0 30px; background-size:cover; height:100%; }
ul.menu { list-style:none; width:90%; margin:0 auto; }
ul.menu li { display:block; margin:0 0 3% 0; width:100%;}
ul.menu li:last-child { margin:0 0 0 0; }
.after5 { width:95%; margin:0 auto; }
.after5bg { background-image:url("../images/after5_3.png"); background-repeat:repeat-y; background-position:top left; background-size:100% 100%; }
.after5bg { background-image:url("../images/after5_5.png"); background-repeat:no-repeat; background-position:bottom left; background-size:100% 100%; }
.stamp { width:95%; margin:0 auto; }
.stampbg { background-image:url("../images/stamp_3.png"); background-repeat:repeat-y; background-position:top left; }
.blackbg { background-color:#000; }
.graybg { background-color:#EFEFEF;}
.bg-item1 { background-image:none; width:95%; margin:0 auto;}
.bg-item2 { background-image:none; width:95%; margin:0 auto;}
.ctr { text-align: center;}
.green { color:#467f41; }
.w900 { width:90%; margin:0 auto; }
.b-w { border:1px solid #f2f4e0; padding:3%; border-radius:5px; width:95%; margin:0 auto; }
.flame-header { width:95%; margin:0 auto;}
.flame-footer { width:95%; margin:0 auto;}
.flame-footer img { vertical-align: top;}
.flame-body { width:95%; margin:0 auto; background-image: url("../images/frame-2.png"); background-repeat: repeat-y; background-position: top center; background-size:contain; padding:0 0 1% 0;}
ul.m-list { width:90%; margin:0 auto; list-style: none; }
ul.m-list li { width:100%; display:block; margin:0 0 3% 0; background-color:#fff; padding:3%;}
ul.m-list li.one { width:100%; display:inline-block; margin:0 0 3%x 0; background-color:#fff; padding:3%;}
ul.m-list li:nth-child(2) { margin:0 0 3% 0; }
/*YouTube*/
.movie {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%;
overflow: hidden;
margin-bottom: 5px;
}
.movie iframe {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
hr.e { height:0; margin:1% auto; width:100%; border:solid 1px #eee;}
.pink1 { width:90%; background-color:#f34f74; text-align: center; border-radius:5px 5px 0 0; margin:0 auto; padding:2% 0;}
.pink1 img { width:70%;}
.pink2 { width:90%; background-color:#fcd3d7; text-align: center; border-radius: 0 0 5px 5px; padding:3% 0; margin:0 auto;}
.pink-txt { color:#f34f74;}
.wht { color:#fff;}
.instagram-media {
min-width: 100% !important;
margin: 0 -1px 3% -1px!important;
border-right: none !important;
border-left: none !important;
}
.mt40 { margin-top:4%!important; }
.mt20 { margin-top:3%!important; }
.smtxt { font-size:0.95em;}
img { border:none; max-width:100%; height:auto; vertical-align:bottom; /* ie8 */}
#floating-menu {
display:block;
position: fixed;
bottom: 1%;
right: 1%;
z-index: 9999;
width:20%!important;
}
#floating-menu img { width:100%; margin:0; text-align:right;}
.kaimono { display:none;}
/*15th*/
.txt-y { color:#fff100;}
.txt-red { color:#e60012;}
.txt-red2 { color:#e61673;}
.txt-gr { color:#489f9d;}
.txt-bl { color:#002855;}
.txt-bl2 { color:#0068b7;}
.subttl-y { color:#fff100; font-size:1.2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r { color:#e60012; font-size:2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r2 { color:#e60012; font-size:1.2rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r3 { color:#e61673; font-size:1.5rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r4 { color:#c11920; font-size:1.5rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-r5 { color:#a40b5d; font-size:1.5rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-gr { color:#00a29a; font-size:1.5rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-gr2 { color:#489f9d; font-size:1.5rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-gr3 { color:#13ae67; font-size:1.5rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-bl { color:#002855; font-size:1.5rem; line-height: 1.3; text-align: center; font-weight:bold;}
.subttl-bl2 { color:#004e85; font-size:1.5rem; line-height: 1.3; text-align: center; font-weight:bold;}
.small0 { font-size:0.6rem;}
.small1 { font-size:0.8rem;}
.large0 { font-size:1rem;}
.large10 { font-size:0.9rem;}
.large15 { font-size:1.2rem;}
.large20 { font-size:1.9rem;}
.bd-btm { border-bottom:dashed 2px #fff; padding:5px;}
.bd-btm1 { border-bottom:solid 3px #000; padding:5px;}
.obi-red { background-color:#e60012; padding:3% 2em 2% 2em; text-align: center; color:#fff100; font-weight:bold; font-size:1rem;}
.obi-blk { background-color:#000; padding:3% 2em 2% 2em; text-align: center; color:#fff100; font-weight:bold; font-size:1rem;}
.obi-ppl { background-color:#601986; padding:2% 0; text-align: center; color:#fff; font-weight:bold; font-size:1rem;}
ul.w-list { list-style: none; margin:0 auto; padding:0; }
ul.w-list li { font-size:1em; line-height: 1.3; text-align: left; text-indent:-1em; padding-left:1em; }
.w450 { width:95%; margin:0 auto; }
.paper { width:95%; margin:0 auto; background-image: url("../images/frame-02.png"); background-repeat: repeat-y; background-position: top center; background-size:100%;}
.bg-gold { background-color: #aa8e4c; width:85%; margin:0 auto;}
.w746 { width:90%; margin:0 auto;}
.w746sp { width:85%; margin:0 auto;}
ul.detail { width:90%; margin:0 auto; list-style: none; }
ul.detail li:nth-child(odd) { width:20%; margin:0 3% 2% 0; background-color:#fff; border-radius:5px; display:inline-block; padding:5px 0; text-align: center; font-size:0.9rem; font-weight: bold; vertical-align: middle;}
ul.detail li:nth-child(even) { width:77%; margin:0 0 2% 0; display:inline-block; font-weight:bold; color:#fff; font-size:1.3rem; text-align: left; vertical-align: middle;}
ul.detail li.s-txt { font-size:1rem; line-height: 1.3; vertical-align: top!important;}
ul.detail li.v-top { vertical-align: top!important;}
ul.detail3 { width:90%; margin:0 auto; list-style: none; }
ul.detail3 li:nth-child(odd) { width:18%; margin:0 3% 0 0; background-color:#fff; border-radius:5px; display:inline-block; padding:3px 0; text-align: center; font-size:0.9rem; font-weight: bold; vertical-align: top;}
ul.detail3 li:nth-child(even) { width:79%; margin:0; display:inline-block; font-weight:bold; color:#fff; font-size:1rem; text-align: left; vertical-align: middle;}
ul.detail2 { width:100%; margin:0 auto; list-style: none; }
ul.detail2 li:nth-child(odd) { width:20%; margin:0 3% 2% 0; background-color:#000; border-radius:5px; display:inline-block; padding:5px 0; text-align: center; font-size:0.9rem; font-weight: bold; vertical-align: top; color:#fff;}
ul.detail2 li:nth-child(even) { width:77%; margin:0 0 2% 0;; display:inline-block; font-weight:bold; color:#000; font-size:1.2rem; text-align: left; vertical-align: middle;}
ul.num { list-style: none; margin:0 auto; padding:0; width:100%;}
ul.num li { font-size:1rem; line-height: 1.3; text-align: left; text-indent:-1em; padding-left:1em; color:#000; margin:0 0 1% 0; font-weight:bold;}
ul.num li::first-letter { color:#e60012; font-size:1.1rem; padding:0 3px 0 0;}
ul.hikikae { list-style: none; margin:0 auto; padding:0; text-align: left;}
ul.hikikae li { font-size:1rem; line-height: 1.3; text-align: left; color:#000; margin:0 0 0 0; font-weight:bold; display:inline-block; vertical-align: top;}
ul.hikikae li:first-child::first-letter { color:#e60012; padding:0 3px 0 0;}
ul.hikikae li:first-child { width:10.5em;}
.photo-frame { border:solid 1px #fff; width:90%; margin:0 auto;}
.bg-wht { background-color:#fff;}
.btn1 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(230,9,18,1.0); }
.btn1 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn1 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn1:hover { opacity: 0.7; }
.btn2 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(72,159,157,1.0); }
.btn2 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn2 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn2:hover { opacity: 0.7; }
.btn3 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(230,22,115,1.0); }
.btn3 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn3 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn3:hover { opacity: 0.7; }
.btn4 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(105,141,200,1.0); }
.btn4 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn4 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn4:hover { opacity: 0.7; }
.btn5 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(141,192,232,1.0); }
.btn5 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn5 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn5:hover { opacity: 0.7; }
.btn6 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(193,25,32,1.0); }
.btn6 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn6 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn6:hover { opacity: 0.7; }
.btn7 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:4em; position:relative; background-color: rgba(19,174,103,1.0); }
.btn7 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn7 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn7:hover { opacity: 0.7; }
.btn8 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(0,105,52,1.0); }
.btn8 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn8 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn8:hover { opacity: 0.7; }
.btn10 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:4em; position:relative; background-color: rgba(96,25,134,1.0); }
.btn10 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn10 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn10:hover { opacity: 0.7; }
.btn9 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:4em; position:relative; border:2px solid #fff;}
.btn9 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn9 a::after { content: ">";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 10px;
}
.btn9:hover { opacity: 0.7; }
.btn11 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(0,104,183,1.0); }
.btn11 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn11 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn11:hover { opacity: 0.7; }
.btn12 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background: linear-gradient(90deg, rgba(156,73,152,1) 0%, rgba(61,98,173,1) 100%); }
.btn12 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn12 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn12:hover { opacity: 0.7; }
.btn13 { width:95%; margin:0 auto; font-size:1.3em; line-height: 1.3; text-align: center; height:3em; position:relative; background-color: rgba(235,109,142,1.0); }
.btn13 a { display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-decoration:none; text-align:center; color:#fff; font-weight:bold;}
.btn13 a::after { content: url("../images/arrow.svg");
position: absolute;
top: 55%;
transform: translateY(-50%);
right: 10px;
}
.btn13:hover { opacity: 0.7; }
.grd-frame { border: 2px solid #c21500; border-image: linear-gradient(to bottom right, #fdd000 0%, #ea5514 100%); border-image-slice: 1; width:90%; margin:0 auto;}
.pb25 { padding-bottom:3%!important; }
.ptb40 { padding-top:4%!important; padding-bottom:4%!important; }
ul.joken { width:90%; margin:0 auto; list-style: none; text-align: left;}
ul.joken li { font-size:0.7rem; line-height: 1.3; margin:0; color:#fff; text-indent:-1em; margin-left:1em; }
ul.joken li:first-child { font-size:0.9rem; color:#e60012;}
ul.joken1 { width:100%; margin:0 auto; list-style: none; text-align:left; }
ul.joken1 li { font-size:0.9rem; line-height: 1.3; margin:0; text-indent:-1em; margin-left:1em;}
.w880 { width:90%; height:auto; margin:0 auto;}
.w880sp { width:95%; height:auto; margin:0 auto;}
.w300 { width:27em; height:auto; margin:0 auto;}
.w90 { width:95%; height:auto; margin:0 auto;}
/*メニュー*/
ul.gmenu { list-style:none; margin:0; padding:60px 0 0 0; text-align:right; width:250px; background-color:#333; }
ul.gmenu li { display:block; margin:0; border-bottom:1px solid #666; text-align:left; height:60px; line-height:60px; padding:0 0 0 1em; font-size:1.1em; background-color: #333; position:relative;}
ul.gmenu li a { display:flex; justify-content:left; align-items:center; width:100%; height:100%; text-decoration:none; color:#fff;}
ul.gmenu li a::after {
content: ">";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 5%;
}
ul.gmenu li:last-child { border-bottom:none; }
/*
.menu-btn {
position: fixed;
top: 0px;
right: 0px;
display: flex;
height: 60px;
width: 60px;
justify-content: center;
align-items: center;
z-index: 99;
background-color: none;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
content: '';
display: block;
height: 3px;
width: 25px;
border-radius: 3px;
background-color: #333;
position: absolute;
}
.menu-btn span:before {
bottom: 8px;
}
.menu-btn span:after {
top: 8px;
}
.menu-btn.active span {
background-color: rgba(255, 255, 255, 0);
}
.menu-btn.active span::before {
bottom: 0;
transform: rotate(45deg);
background-color:#fff;
}
.menu-btn.active span::after {
top: 0;
transform: rotate(-45deg);
background-color:#fff;
}
*/
/*
#menu-btn-check:checked ~ .menu-btn span {
background-color: rgba(255, 255, 255, 0);
}
#menu-btn-check:checked ~ .menu-btn span::before {
bottom: 0;
transform: rotate(45deg);
background-color:#fff;
}
#menu-btn-check:checked ~ .menu-btn span::after {
top: 0;
transform: rotate(-45deg);
background-color:#fff;
}
*/
#menu-btn-check {
display: none;
}
article.open { transform: translateX(-250px); transition: all .5s;}
nav {
width: 250px;
position: fixed;
top: 0;
right: 0;
z-index: 10;
transform: translate(250px);
transition: all .5s;
background-color: #333;
height:100%;
}
nav.open { transform: translateZ(0);}
.sp-fix { position:fixed; z-index:99999; background-color:#fff; height:60px;}
#item01 { margin-top:-60px; padding-top:60px;}
#item02 { margin-top:-60px; padding-top:60px;}
#item03 { margin-top:-60px; padding-top:60px;}
#item04 { margin-top:-60px; padding-top:60px;}
#item05 { margin-top:-60px; padding-top:60px;}
ul.f-menu-sp { list-style: none; margin:0 auto 4% auto; text-align:center; padding:0 2.5%; width:100%; display:block;}
ul.f-menu-sp li { display:inline-block; width:32.666%; margin:0 1% 1% 0;}
ul.f-menu-sp li:nth-child(3n) { margin:0 0 1% 0; }
ul.f-menu-sp li:last-child { margin:0 0 1% 0; }
.position { position: relative; }
.w781 { width:95%; margin:0 auto; padding:0;}
.w780 { width:95%; margin:0 auto; padding:0;}
.w779 { width:95%; margin:0 auto; padding:0;}
.w818 { width:95%; margin:0 auto; padding:0; background-color:#fff;}
.w814 { width:95%; margin:0 auto; padding:0; background-color:#fff;}
.icon-box { width:100%; box-sizing: border-box; border:solid 5px #b93a2c; border-top:none; padding:20px;}
ul.icon-list { list-style: none; width:100%; margin:0; padding:0; text-align: left;}
ul.icon-list li { display:inline-block; vertical-align: middle; margin:0; padding:0;}
ul.icon-list li:first-child { width:8%; margin:0 2% 0 0;}
ul.icon-list li:last-child { font-weight:bold; font-size:0.7rem; line-height: 1.4; width:90%}
ul.icon-list li.one { font-weight:bold; font-size:0.85rem; line-height: 1.2;}
.bg-ladys { background-color:#b93a2c; margin:0 auto; padding:0;}
hr.ladys { border-style: none; border-top: 3px solid #ee87b4; margin:3% auto; width:100%; padding:0;}
hr.ladysmens { border-style: none; border-top: 3px solid #796baf; margin:3% auto; width:100%; padding:0;}
hr.kids { border-style: none; border-top: 3px solid #e8374a; margin:3% auto; width:100%; padding:0;}
hr.goods { border-style: none; border-top: 3px solid #1a9f3c; margin:3% auto; width:100%; padding:0;}
hr.zakka { border-style: none; border-top: 3px solid #734b23; margin:3% auto; width:100%; padding:0;}
hr.foods { border-style: none; border-top: 3px solid #fbc400; margin:3% auto; width:100%; padding:0;}
hr.cafe { border-style: none; border-top: 3px solid #cbae3a; margin:3% auto; width:100%; padding:0;}
hr.service { border-style: none; border-top: 3px solid #00b9ef; margin:3% auto; width:100%; padding:0;}
.mpt250 { margin-top:0; padding-top:0;}
.mpt500 { margin-top:-30%; padding-top:30%;}
.pb200 { padding-bottom:200px;}
.mt300 { margin-top:0;}
.small2 { font-size:0.7rem;}
ul.gmenu { list-style:none; margin:0; padding:60px 0 0 0; text-align:right; width:250px; background-color:#fff; }
ul.gmenu li { display:block; margin:0; border-bottom:1px solid #666; text-align:left; height:60px; line-height:60px; padding:0 0 0 0; font-size:1.1em; background-color: #fff; position:relative;}
ul.gmenu li a { display:flex; justify-content:left; align-items:center; width:100%; height:100%; text-decoration:none; color:#333; padding:0 0 0 1em;}
ul.gmenu li a::after {
content: ">";
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 5%;
}
ul.gmenu li:last-child { border-bottom:none; }
.menu-btn {
position: fixed;
top: 5px;
right: 5px;
display: flex;
height: 50px;
width: 50px;
justify-content: center;
align-items: center;
z-index: 99;
background-color: #fff;
border-radius:50vh;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
content: '';
display: block;
height: 3px;
width: 25px;
border-radius: 3px;
background-color: #333;
position: absolute;
}
.menu-btn span:before {
bottom: 8px;
}
.menu-btn span:after {
top: 8px;
}
.menu-btn.active span {
background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}
.menu-btn.active span::before {
bottom: 0;
transform: rotate(45deg);
background-color:#333;
}
.menu-btn.active span::after {
top: 0;
transform: rotate(-45deg);
background-color:#333;
}
/*
#menu-btn-check:checked ~ .menu-btn span {
background-color: rgba(255, 255, 255, 0);
}
#menu-btn-check:checked ~ .menu-btn span::before {
bottom: 0;
transform: rotate(45deg);
background-color:#fff;
}
#menu-btn-check:checked ~ .menu-btn span::after {
top: 0;
transform: rotate(-45deg);
background-color:#fff;
}
*/
#menu-btn-check {
display: none;
}
article.open { transform: translateX(-250px); transition: all .5s;}
nav {
width: 250px;
position: fixed;
top: 0;
right: 0;
z-index: 10;
transform: translate(250px);
transition: all .5s;
background-color: #fff;
height:100%;
}
nav.open { transform: translateZ(0);}
ul.disp li.disp-right {
display: block;
}
/*17th*/
ul.top-logo { list-style: none; margin:0 auto; width:80%; }
ul.top-logo li {display:inline-block; vertical-align: middle;}
ul.top-logo li:first-child { width:46%; text-align: left;}
ul.top-logo li:first-child img { width:95%;}
ul.top-logo li:nth-child(2) { width:8%;}
ul.top-logo li:last-child { width:46%;}
.kv { width:100%; height:auto; margin:0 auto; padding:0;}
.bg-bw { background-color: #231815;}
.z1 { z-index:9999999; position:relative;}
.w866 { width:86.6%; margin:0 auto;}
.w740 { width:90%; margin:0 auto;}
.pt695 { padding-top:69.5%;}
.bd-btm3 { width:22em; padding-bottom:0.05em; margin:0 auto; border-bottom:1px solid #000;}
.bd-tb { padding:4% 0; margin:0 auto; border-bottom:1px solid #000; border-top:1px solid #000;}
.cut1 { position: absolute; top:0; right:0; pointer-events: none;}
.cut2 { position: absolute; top:31%; right:0; pointer-events: none;}
.cut3 { position: absolute; bottom:-1%; right:0; pointer-events: none;}
.cut4 { position: absolute; top:20%; right:0; pointer-events: none;}
.cut5 { position: absolute; bottom:34%; right:0; pointer-events: none;}
.cut6 { position: absolute; bottom:21%; right:0; pointer-events: none;}
.cut7 { position: absolute; top:40%; right:0; pointer-events: none;}
.cut8 { position: absolute; bottom:2.5%; right:0; pointer-events: none;}
.cut9 { position: absolute; top:28.5%; right:5%; pointer-events: none;}
ul.stecker { width:90%; list-style: none; margin:0 auto; padding:0;}
ul.stecker li { display:inline-block; margin:0; padding:0; vertical-align: top;}
ul.stecker li.blk { width:26%; height: 3em; margin:0 3% 0 0; background-color:#000010; position:relative;}
ul.stecker li.blk div { color:#fff; margin:0; padding:0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:95%;}
ul.stecker li:last-child { width:71%; text-align: left; margin:0; padding:0;}
ul.stecker-2 { width:90%; list-style: none; margin:0 auto; padding:0;}
ul.stecker-2 li { display:inline-block; margin:0; padding:0; vertical-align: top;}
ul.stecker-2 li.blk { width:26%; height: 2em; margin:0 3% 0 0; background-color:#000010; position:relative;}
ul.stecker-2 li.blk div { color:#fff; margin:0; padding:0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:95%;}
ul.stecker-2 li:last-child { width:71%; text-align: left; margin:0; padding:0;}
ul.stecker-3 { width:90%; list-style: none; margin:0 auto; padding:0;}
ul.stecker-3 li { display:inline-block; margin:0; padding:0; vertical-align:middle;}
ul.stecker-3 li.top { display:inline-block; margin:0; padding:0; vertical-align:top;}
ul.stecker-3 li.blk { width:26%; height: 2em; margin:0 3% 0 0; background-color:#000010; position:relative;}
ul.stecker-3 li.blk div { color:#fff; margin:0; padding:0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:95%;}
ul.stecker-3 li:last-child { width:71%; text-align: left; margin:0; padding:0;}
.lh12 { line-height: 1.2;}
.bg-pink { background-color: #f7d3d8;}
.w680 { width:90%; margin:0 auto; padding:0;}
ul.present { list-style: none; width:90%; margin:0 auto; padding:0;}
ul.present li { display: inline-block; margin:0; padding:0; font-size:3vw; font-weight:bold;}
ul.present li:first-child { width:86%; text-align: left;}
ul.present li:last-child { width:14%; text-align: right;}
.ptb20 { padding-top:2%!important; padding-bottom:2%!important; }
.font14 { font-size:1.6vw;}
.font16 { font-size:1.8vw;}
.font18 { font-size:2vw;}
.font20 { font-size:2.2vw;}
.font22 { font-size:2.4vw;}
.font24 { font-size:2.6vw;}
.font26 { font-size:2.8vw;}
.font28 { font-size:3vw;}
.font30 { font-size:3.2vw;}
.font32 { font-size:3.4vw;}
.font34 { font-size:3.6vw!important;}
.font36 { font-size:3.8vw;}
.font38 { font-size:4vw!important;}
.font40 { font-size:4.2vw;}
.font42 { font-size:4.6vw;}
.font44 { font-size:4.8vw;}
.font46 { font-size:5vw;}
.font50 { font-size:5.2vw;}
.pb60 { padding-bottom:6%;}
.pb80 { padding-bottom:8%;}
ul.header-logo { list-style: none; margin:1% auto; padding: 0; width:100%; text-align: center; min-width:100%;}
ul.header-logo li { display:inline-block; margin:0; width:49%!important; padding:0; text-align: left; vertical-align: middle;}
ul.header-logo li:last-child {text-align:right;}
ul.header-logo li img { width:55%!important;}
ul.header-logo li:last-child img { width:60%!important;}
/*スポーツ*/
.menu { width:100%; display: flex; justify-content: space-between; flex-wrap:wrap;}
.menu div { width:32.44%; margin-bottom:1.34%;}
.menu div:last-child { }
.w900 { width:90%; margin:0 auto; }
.ptb60 { padding-top:6%!important; padding-bottom:4%!important; }
.bg-red { background-color:#d22d3c;}
.bg-blue { background-color:#033988;}
.bg-wht { background-color:#fff;}
.w778 { width:82%; margin:0 auto; padding:0;}
.w644 { width:85%; margin:0 auto; padding:0;}
.lh13 { line-height: 1.3;}
.f-blue {color:#003987!important;}
.f-red { color:#ce142c;}
.bd-blue { border-top:2px solid #003987; margin:4% 0;}
.wht { color:#fff!important;}
.font-w90 { transform: scale(0.9, 1); transform-origin: top left; width: 111%; white-space: nowrap;}
.underline { text-decoration: underline;}
.d1 { position: relative;
z-index: 1;
width:100%;
height:auto!important;
text-align: center;
margin: 0 auto;
padding:0.2em 0;
}
.d1 span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:95%;}
.ht2 { height:2em!important;}
.ht3 { height:3em;}
.noto {
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
font-feature-settings: "palt";
}
.noto-bold {
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal;
font-feature-settings: "palt";
}
.date { width:100%; margin:0 auto; display:flex; justify-content: space-between; }
.date div:first-child { width:22%; color:#fff; margin:0 3% 0 0; font-size:2.8vw;}
.date div:last-child { width:75%; text-align: left; padding:0; color:#fff; font-size:3.8vw;}
.date1 { width:100%; margin:0 auto; display:flex; justify-content: space-between; }
.date1 div:first-child { width:22%; color:#fff; margin:0 3% 0 0; font-size:2.8vw;}
.date1 div:last-child { width:75%; text-align: left; padding:0; color:#003987; font-size:3.8vw;}
.d1 { position: relative;
z-index: 1;
width:5em;
height:2em;
text-align: center;
margin: 0 auto;
}
.d1 span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width:95%;}
.w893 { width:95%; margin:0 auto; }
.w807 { width:90%; margin:0 auto; }
.w777 { width:90%; margin:0 auto; }
.yk100 { position:absolute; top:-10%!important; right:0; width:22vw; height:auto;}
.btm-gray { border-bottom:2px solid #9fa0a0;}
.icon-event { position:absolute; bottom:0; left:-5%; width:20vw; height:auto;}
/*bs2024*/
ul.event-date { list-style: none; margin:0 auto; padding:1.5% 0; border-top: solid 1px #231815;}
ul.event-date li { display:inline-block; vertical-align: middle; margin:0; text-align: left;}
ul.event-date1 { list-style: none; margin:0 auto; padding:1.5% 0; border-top: solid 1px #231815; border-bottom: solid 1px #231815;}
ul.event-date1 li { display:inline-block; vertical-align: middle; margin:0; text-align: left;}
/*bs2024*/
.menu { width:61.6%; display: flex; justify-content: space-between; flex-wrap:wrap;}
.menu div { width:49%; margin-bottom:2%;}
.menu div:last-child { }
ul.attention { list-style: none; }
ul.attention li { text-indent: -1em; padding-left:1em; text-align: left;}
.f-red1 { color:#e60020;}
.f-blk { color:#000;}
.ttl1-parts { position:absolute; top:0; left:0;}
.va-m { vertical-align: middle;}
.w1000 { width:100%; margin:0 auto; position:relative;}
.w946 { width:95%; margin:0 auto;}
.w835 { width:83%; margin:0 auto;}
.w830 { width:83%; margin:0 auto;}
.w688 { width:70%; margin:0 auto;}
.w710 { width:85%; margin:0 auto;}
ul.event-date { width:83%; list-style: none; margin:0 auto; padding:1% 0; border-top: solid 2px #231815; text-align: left;}
ul.event-date li { display:inline-block; vertical-align: middle; margin:0; text-align: left;}
ul.event-date1 { width:83%; list-style: none; margin:0 auto; padding:1% 0; border-top: solid 2px #231815; border-bottom: solid 2px #231815; text-align: left;}
ul.event-date1 li { display:inline-block; vertical-align: middle; margin:0; text-align: left;}
ul.event-date2 { width:83%; list-style: none; margin:0 auto; padding:1% 0; border-top: solid 2px #231815; text-align: left;}
ul.event-date2 li { display:inline-block; vertical-align: top; margin:0; text-align: left;}
ul.event-date3 { width:83%; list-style: none; margin:0 auto; padding:1% 0; border-top: solid 2px #231815; border-bottom: solid 2px #231815; text-align: left;}
ul.event-date3 li { display:inline-block; vertical-align: top; margin:0; text-align: left;}
ul.event-date3 li:first-child { width:33%;}
ul.event-date3 li:last-child { width:67%;}
.item { width:100%; display: flex; justify-content: space-between; flex-wrap:wrap;}
.item div:first-child { width:50%;}
.item div:last-child { width:45%; text-align: justify;}
.item div:last-child p { margin:0; padding:0; line-height: 1.4; text-align: justify;}
.flex-middle { align-items: center!important; }
sup { font-size: 70%; vertical-align: super; white-space: nowrap;}
.ind { padding-left: 1.7em; text-indent: -1.7em; margin-left:1.7em!important;}
.ind1 { padding-left: 1em; text-indent: -1em; margin-left:1em!important;}
img.vt { vertical-align: top; margin:0; padding:0;}
/*bf2025*/
.w760 { width:76%; margin:0 auto;}
.pt40 { padding-top:4%;}
.ind3 { padding-left: 2em; text-indent: -2em; }
.ind4 { padding-left: 1.5em; text-indent: -1.5em; }
.box9 { transform: scale(0.8, 1); width:125%; transform-origin: top left;}
.btn-top { position: fixed; bottom:1%; right:1%; width:50px; height:50px; z-index:999;}
.btn-top img { width:100%; height:auto;}
/*Life with YOKOHAMA*/
.bg-y { background-color:#fefbec; }
.w722 { width:72.2%; margin:0 auto;}
.w867 { width:86.7%; margin:0 auto;}
.menu { display: flex; justify-content: space-between; flex-wrap:wrap; width:100%;}
.menu div { width:32%; }
.menu div:last-child { }
.bg1 { background-image: url("../images/f1-bg-1.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg2 { background-image: url("../images/f1-bg-2.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg3 { background-image: url("../images/f1-bg-3.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg4 { background-image: url("../images/f2-bg-1.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg5 { background-image: url("../images/f2-bg-2.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg6 { background-image: url("../images/f2-bg-3.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg7 { background-image: url("../images/f3-bg-1.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg8 { background-image: url("../images/f3-bg-2.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg9 { background-image: url("../images/f3-bg-3.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg10 { background-image: url("../images/f4-bg-1.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.bg11 { background-image: url("../images/f4-bg-2.png") ; background-repeat: no-repeat; background-position: top center; background-size:100%;}
.lh15 { line-height: 1.5;}
.lh18 { line-height: 1.8;}
.lh20 { line-height: 2.0;}
.item-detail { display:flex; width:100%!important;}
.item-detail div:first-child { width:41.7%!important;}
.item-detail div:last-child { width:58.3%!important; }
.item-detail div.item-txt { display:block; width:152%!important;}
.item7 { position:absolute; top:-60%; left:0;}
.mt-80 { margin-top:-18%!important; }
.mt80 { margin-top:8%!important; }
.mt80s { margin-top:20%!important; }
/*スライド*/
.sliderArea {
max-width: 86.7%;
width:86.7%;
height : auto;
margin: 0 auto;
padding: 0;
}
}