@charset "UTF-8"; /* RESET - ADAPTED FROM MEYER RESET URL - http://meyerweb.com/eric/tools/css/reset/ LICENSE - PUBLIC DOMAIN */ a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, caption, canvas, center, cite, code,dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, form, footer, header, hgroup, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, main, small, span, strike, strong, sub, summary, sup, tt, table, tbody, textarea, tfoot, thead, time, tr, th, td,u, ul, var, video{font-family:inherit;font-size:100%;font-weight:inherit;font-style:inherit;vertical-align:baseline;margin:0;padding:0;border:0;outline:0;background:transparent;}article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main{display:block;}ol, ul{list-style:none;}blockquote, q{quotes:none;}table{border-collapse:collapse;border-spacing:0;}body{line-height:1;} textarea{font-family:inherit;font-size:100%;font-weight:inherit;font-style:inherit;vertical-align:baseline;margin:0;padding:0;} /* YUI 3.14.1 (build 63049cb) Copyright 2013 Yahoo! Inc. All rights reserved. Licensed under the BSD License. http://yuilibrary.com/license/ */ body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small}select,input,button,textarea{font:99% arial,helvetica,clean,sans-serif}table{font-size:inherit;font:100%}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%}#yui3-css-stamp.cssfonts{display:none} *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; *behavior:url(boxsizing.htc);} @font-face { font-family: 'fontello'; src: url('font/fontello.eot?49399899'); src: url('font/fontello.eot?49399899#iefix') format('embedded-opentype'), url('font/fontello.woff2?49399899') format('woff2'), url('font/fontello.woff?49399899') format('woff'), url('font/fontello.ttf?49399899') format('truetype'), url('font/fontello.svg?49399899#fontello') format('svg'); font-weight: normal; font-style: normal; } [class^="icon-"]:before, [class*=" icon-"]:before { font-family: "fontello"; font-style: normal; font-weight: normal; display: inline-block; text-decoration: inherit; width: 1em; text-align: center; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-basket:before { content: '\e800'; } .icon-youtube-play:before { content: '\f16a'; } .icon-instagram:before { content: '\f16d'; } // BASE COLOR @white:#FFF; @black:#111; @gray:#ccc; @grayD:#666; @grayL:#eee; @green:#32b7a2; // LESS @ncc:no-repeat center center; // MIXIN .trans{-webkit-transition:0.4s; -moz-transition:0.4s; -o-transition:0.4s; -ms-transition:0.4s; transition:0.4s;} .tac{text-align:center;} .tar{text-align:right;} .tdn{text-decoration:none;} .tdu{text-decoration:underline;} .bgsc{-webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover;} .inline{display:-moz-inline-box; display:inline-block;} .fb{font-weight:bold;} /*BASE*/ html,body{width:100%; margin:0; padding:0;} body{line-height:1; -webkit-text-size-adjust:100%; color:@black; font-size:16px; font-weight:600; font-family:a-otf-gothic-bbb-pr6n,sans-serif; font-feature-settings:"palt"; font-family:"Montserrat","Helvetica Neue","Helvetica","游ゴシック Medium","Yu Gothic Medium","游ゴシック体","游ゴシック","Yu Gothic",YuGothic,"Meiryo UI","メイリオ",Meiryo,sans-serif; } img{max-width:100%; height:auto; vertical-align:middle;} /*CF*/ .cf:before,.cf:after{content:" ";display:table;}.cf:after{clear:both;}.cf{*zoom:1;} /*LINK*/ a:link{color:@black; .tdu(); .trans();} a:visited{color:@black; .tdu();} a:hover{color:@green; .tdu();} a:active{color:@black; .tdu();} a img{border:none; .tdn(); .trans();} a img:hover{border:none; opacity:0.6; .tdn();} /*LETTER*/ strong{.fb();} .wf{font-family:'Montserrat'; font-weight:600;} .fontsmall{font-size:85%!important;} .fontlarge{font-size:124%!important;} ::selection{background:@green; color:@white;} ::-moz-selection{background:@green; color:@white;} /*MAIN*/ main{position:relative; clear:both; overflow:hidden; display:block; height:100%;} main.newssg{background:@white; h2{font-size:26px; letter-spacing:1px; margin:0 0 6%; font-weight:700; line-height:1.5; color:@green;} div.topteaser{ header{margin:0;} } div.pagebody{padding:6%; article{ div.postbody{margin:0 0 12%; span.postdate{color:@gray; font-weight:normal;} h3{border-top:1px solid @gray; border-bottom:1px solid @gray; padding:24px 0; margin:0 0 6%; font-size:18px; letter-spacing:1px; line-height:1.7;} p{font-weight:normal; margin:0 0 6%; line-height:1.8; font-size:93%;} } } } } div.spbox{position:relative;} /*KV*/ div.topteaser{position:relative; width:100%; margin:0; padding:12% 6% 12%; background:url("../img/tate.jpg") @ncc; .bgsc(); header{margin:0 auto 12%; h1{width:50%; margin:0 auto;} } div.topkv{position:relative; width:100%; img{box-shadow:2px 2px 25px rgba(0,0,0,0.4); position:relative; display:block;} } } div.cdbox{padding:12% 6% 6%; background:@white; .bgsc(); h1{color:@green; font-size:28px; letter-spacing:1px; margin:0 0 6%; font-weight:700;} h2{font-size:24px; letter-spacing:1px; margin:0 0 6%; font-weight:700; line-height:1.5; .tac();} div.cd{width:88%; margin:0 auto 6%;} } div.linkbtn{width:88%; margin:0 auto 12%; .tac(); .fb(); a{display:block; letter-spacing:1px; font-size:14px; padding:20px 0; border:3px solid @black; border-radius:4px;} a:link{color:@black; .tdn;} a:visited{color:@black; .tdn;} a:hover{color:@white; .tdn; background:@green; border:3px solid @green;} a:active{color:@black; .tdn;} } div.topbox{background:url("../img/tate.jpg") @ncc; .bgsc(); padding:12% 6%; div.boxbg{background:rgba(255,255,255,0.6); padding:12% 6%; box-shadow:2px 2px 25px rgba(0,0,0,0.2)} h2{color:@green; font-size:28px; letter-spacing:1px; margin:0 0 6%; font-weight:700;} div.txtbox{margin:0 0 12%; p{font-size:13px; line-height:1.8; letter-spacing:1px; margin:0 0 6%;} p.en{letter-spacing:0;} p:last-child{margin:0;} em{background:@green;} } div.txtbox:last-child{margin:0;} } div.topnews{padding:12% 6% 6%; background:@white; .bgsc(); h2{color:@green; font-size:28px; letter-spacing:1px; margin:0 0 6%; font-weight:700;} ul{ li{margin:0 0 6%; span{font-size:11px; display:block; margin:0 0 5px; color:@gray;} a{line-height:1.7;} } } } /*FOOTER*/ footer{padding:6% 0; background:url("../img/bgs.jpg") @ncc; .bgsc(); .tac(); div.sns{margin:0 0 6%; display:-webkit-flex; display:flex; -webkit-flex-flow:row nowrap; flex-flow:row nowrap; -webkit-justify-content:space-between; justify-content:space-between; -webkit-align-items:flex-start; align-items:flex-start; i{font-size:200%;} a{width:33.333%;} a:link{color:@black; .tdn();} a:visited{color:@black; .tdn();} a:hover{color:@green; .tdn();} a:active{color:@black; .tdn();} } small{display:block; font-size:10px; line-height:2; a:link{color:@black; .tdu();} a:visited{color:@black; .tdu();} a:hover{color:@green; .tdu();} a:active{color:@black; .tdn();} span{display:block;} } } /****************************************************/ /************************ PC ************************/ /****************************************************/ @media(min-width:768px){ html,body{min-width:1120px;} body{background:url("../img/bg.jpg") no-repeat center left; .bgsc(); background-attachment:fixed;} .sp{display:none!important;} .pc{display:block;} main{width:375px; margin:0 auto; box-shadow:2px 2px 25px rgba(0,0,0,0.4);} /*KV*/ div.topteaser{height:auto;} div.pcbody{position:relative; width:100%; height:100vh; div.pcbox{position:fixed; width:60%; min-width:740px; height:100vh; div.sitelogo{position:absolute; top:5%; left:5%; width:320px;} } div.spbox{width:430px; margin:0 0 0 65%;} } } /************************ SP ************************/ @media (max-width:767px) { .pc{display:none;} .sp{display:block;} } /*----------------------------------------------------- 10px = 77% 11px = 85% 12px = 93% 13px = 100% 14px = 108% 15px = 116% 16px = 123.1% 17px = 131% 18px = 138.5% 19px = 146.5% 20px = 153.9% 21px = 161.6% 22px = 167% 23px = 174% 24px = 182% 25px = 189% 26px = 197% ------------------------------------------------------*/