@charset "utf-8";
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form, label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main,summary,time,mark,audio,video,a,input,textarea,section{ margin:0;padding:0; border:0; font-size:100%; background:transparent; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main{ display:block;}
nav ul{ list-style:none;}
ul{ list-style:none; }
blockquote,q{ quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{ content:''; content:none;}
pre,code,kbd,samp{ font-family:monospace,monospace; font-size:inherit;}
table{ border-collapse:collapse; border-spacing:0;}
img{ border:0;}
address,caption,cite,code,dfn,em,th,var{ font-style:normal; font-weight:normal;}
caption,th{ text-align:left;}
h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:normal}
sup{ vertical-align:text-top; font-size:75%;}
sub{ vertical-align:text-bottom; font-size:75%;}
input,textarea,select{ z-index:auto; font-family:inherit; font-size:inherit; font-weight:inherit; vertical-align:middle;}
a{ outline:none;}
audio:not([controls]){ display:none;}
time{ display:inline;}
[hidden]{ display:none;}
input::-ms-clear,input::-ms-reveal,input:focus::-ms-clear,input:focus::-ms-reveal{visibility:hidden; display:none;}
button::-moz-focus-inner,input[type="reset"]::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inner,input[type="file"]>input[type="button"]::-moz-focus-inner{ padding:0; border:0; outline:none;}
/*==================================================== */
body{-webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased;
/*font-family:'Roboto','Droid Sans',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;*/
font-family: /*'Open Sans Condensed',MyYuGptjocM,YuGothic,*/-apple-system,BlinkMacSystemFont,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Hiragino Kaku Gothic ProN",Meiryo,san-serif;
line-height:1.8;}
button{font-family:'Roboto','Droid Sans',"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif; cursor:pointer;}
a:link{ color:#373737;}
a:visited{ color:#373737;}
a:hover {color:#373737; transition:background 0.2s;}
a:active{color:#373737;}
*{-webkit-tap-highlight-color:rgba(0,0,0,0);}
.clr{clear:both;}
.hide{position:absolute !important; left:-9999px !important; top:-9999px !important;}
.clr{clear:both;}
section {clear:both; zoom:1;}
article:after,
section:after,
.clrFx:after{content:''; clear:both; display:block;}
.transition{-webkit-transition:0.3s ease; -moz-transition:0.3s ease; -ms-transition:0.3s ease; -o-transition:0.3s ease; transition:0.3s ease; filter:alpha(opacity=60); -moz-opacity:0.6; opacity:0.6;}
img{-ms-interpolation-mode:bicubic;}

/* chrome bug fix*/
*{max-height:999999px;}
*,*::before,*::after {will-change:all;}
textarea,input[type="email"],input[type="password"],input[type="text"],input[type="button"],input[type="submit"]{-webkit-appearance:none;}
textarea{resize:vertical;}
input:-webkit-autofill {-webkit-box-shadow:0 0 0px 1000px rgba(255,255,255,1) inset; outline:none;}
input,button{ outline:none;}
area{ border:none; outline:none;}
a {cursor:pointer;}

/*
	BASE SET
__________________________________________________*/
html{overflow:visible;}
html,body {margin:0; padding:0;}
body {position:static; overflow:auto; width:auto; *overflow-y:hidden; font-size:0; line-height:1; z-index:0; color:#1f1f1f;}

.over-section{margin:0 -360px; zoom:1; position:relative; *overflow-y:hidden; clear:both; padding:0;}
.over-section:after{content:''; clear:both; display:block;}

main {width:100%;}
section {width:100%; margin:0 auto; clear:both; zoom:1; position:relative; z-index:100; padding:0;}
.wrap   {margin:0 auto; clear:both; zoom:1; position:relative; z-index:100; padding:0;}
.contents   {margin:0 auto; clear:both; zoom:1; position:relative; z-index:100; padding:0;}
section:after,.wrap:after{content:''; clear:both; display:block;}
*,*::before,*::after {box-sizing:border-box;}

/* main parts */
main {font-size:0; line-height:1; position:relative;}

#medaPortal {position:relative; overflow: hidden;}

@media screen and (min-width:641px){

/******************************************************************************************************************************

	PC SITE


*/
#medaPortal {min-width:1200px; padding:61px 0 0; min-height: 640px;}
.wrap {width:1200px; margin: 0 auto; position: relative;}
.contents   {min-width:1200px; opacity:0; width: 100%;}
.windowloaded .contents {opacity:1; transition:0.5s ease-out;}
#medaPortal .pc {display: block;}
#medaPortal .sp {display: none;}
#medaPortal .common_bnr {display: block;}

#siteHeader {height: 62px; position: fixed; left: 0; top: 0; width: 100%; z-index: 1000; background: #fff; border-bottom: 1px solid #292929; min-width: 1200px;}
#siteHeader:after{content: ''; clear: both; display: block;}
#siteHeader #logo {position: relative; z-index: 20;}
#siteHeader #logo a{transition: 0.5s;}
#siteHeader #logo a:hover{opacity: 0.7;}
#siteHeader ul {background: url(/common/images/nav.png) left top no-repeat; height: 61px; position: absolute; left: 364px; top: 0; width: 100%; z-index: 20;}
#siteHeader ul li {display: inline-block;}
#siteHeader ul li + li {margin-left: 23px;}
#siteHeader ul li a{height: 61px; display: block; width: 78px;}
#siteHeader ul li.about a {width: 118px;}
#siteHeader ul li.history a {width: 148px;}
#siteHeader ul li.goods a {width: 121px;}
#siteHeader ul li.special a {width: 141px;}
/*
#siteHeader ul:after{content: ''; background: #686868; height: 5px; width: 78px; position: absolute; left: 0; top: 0; transition: 0.5s ease-out;}
#siteHeader ul.gn1:after {left: 0; width: 78px;}
#siteHeader ul.gn2:after {left: 99px; width: 118px;}
#siteHeader ul.gn3:after {left: 242px; width: 148px;}
#siteHeader ul.gn4:after {left: 416px; width: 121px;}
#siteHeader ul.gn5:after {left: 558px; width: 141px;}
*/
#siteHeader ul:after{content: ''; background: #686868; height: 5px; width: 73px; position: absolute; left: 3px; top: 0; transition: 0.5s ease-out;}
#siteHeader ul.gn1:after {left: 3px;}
#siteHeader ul.gn2:after {left: 120px;}
#siteHeader ul.gn3:after {left: 281px;}
#siteHeader ul.gn4:after {left: 441px;}
#siteHeader ul.gn5:after {left: 592px;}

#spmenu {display: none;}

#siteFooter {/*margin: 94px 0 0;*/ padding: 94px 0 0;}
#siteFooter .footerContents{background: url(/common/images/footer-bg.png); padding: 43px 0 69px; border-bottom: 5px solid #686868;}
#siteFooter .footerContents h2 {margin-bottom: 15px;}
#siteFooter .footerContents .wrap {padding: 0 20px;}
#siteFooter .copyright {font-size: 13px; line-height: 58px; color: #000; text-align: center; letter-spacing: 0.1em;}
#siteFooter .twitterWidget {width: 370px; float: left;}
#siteFooter .bnrs img {width: 370px; height: auto;}
#siteFooter .bnrs {padding: 20px 0 0;}
#siteFooter .bnrs ul li {display: inline-block; vertical-align: top;}
#siteFooter .bnrs ul li {margin:20px 0 0  25px;}
#siteFooter .bnrs a img {transition: 0.5s;}
#siteFooter .bnrs a:hover img{opacity: 0.7;}
#siteFooter .sns {display: none;}

#pageHeader {width:1160px; margin: 0 auto; text-align: left; position: relative; height: 264px;}
#pageHeader h1 {position: absolute; right: 1px; top: 42px; z-index: 100;}
#pageHeader ul.sns {padding: 38px 0 0; position: relative; z-index: 10;}
#pageHeader ul.sns img {width: 48px; height: auto; transition: 0.5s;}
#pageHeader ul.sns a:hover img {opacity: 0.7;}
#pageHeader ul.sns li {display: inline-block; padding: 0 14px 0 0;}

}
@media screen and (min-width:1921px){

}


@media screen and (max-width:640px){

/******************************************************************************************************************************

	SP SITE


*/

#medaPortal {padding-top:16.71875vw; width:100%; height:auto !important;}
#medaPortal main {margin:0 auto 0; position:relative; z-index:10; font-size:0; line-height:1; text-align:center;}

#medaPortal .sp {display:inline-block;}
#medaPortal .pc {display:none !important;}
#medaPortal .common_bnr {display:inline-block;}

#siteHeader {height: 16.71875vw; position: fixed; left: 0; top: 0; width: 100%; z-index: 1000; background: #fff;}
#siteHeader #logo {position: relative; z-index: 1000;}
#siteHeader #logo a{display: block; background: url(/common/images/sp/logo-portalsite.png) center top no-repeat; height: 16.71875vw; background-size: 100% auto;}
#siteHeader #logo a img {display: none;}
#spmenu {position: fixed; right: 2.03125vw; top: 2.03125vw; z-index: 1001;}
#spmenu a {display: block; width: 12.5vw; height: 12.5vw; position: relative;}
#spmenu a:after{content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(/common/images/sp/menu-close.png) left top no-repeat; width: 100%; height: 100%; background-size: 100% auto; opacity: 0; }
.menuopen #spmenu a:after {opacity: 1;}
#spmenu a img {width: 100%; height: auto;}
.menuopen #spmenu a img{opacity: 0;}

#siteHeader nav {width: 100%; position: fixed; left: 0; top:-100%; background: rgba(255,255,255,0.95); height: 100%; z-index: 999; transition:opacity 0.5s; opacity: 0;}
.menuopen #siteHeader nav{top: 0; opacity: 1;}
.menuclose #siteHeader nav{top: 0 !important;}

#siteHeader .scroll {height: 100%; overflow:hidden; overflow-y:scroll;}
#siteHeader ul{ padding: 32.5vw 0 10.625vw;}
#siteHeader ul li + li {margin-top: 10.625vw;}
#siteHeader ul li a {height: 11.5625vw; display: block; background: url(/common/images/sp/nav.png) center 3.90625vw no-repeat; background-size: 100% auto; position: relative; text-decoration: none; font-size: 0;text-indent: 200%; overflow: hidden; white-space: nowrap;}
#siteHeader ul li:nth-child(2) a {background-position: center -17.96875vw;}
#siteHeader ul li:nth-child(3) a {background-position: center -40.15625vw;}
#siteHeader ul li:nth-child(4) a {background-position: center -62.1875vw;}
#siteHeader ul li:nth-child(5) a {background-position: center 3.90625vw; background-image: url(/common/images/sp/nav-special.png);}

#siteHeader ul li {position: relative;}
#siteHeader ul li:after{content: ''; background: #686868; height: 1.09375vw; width: 14.0625vw; position: absolute; left: 50%; top: 10.46875vw; margin-left: -7.03125vw; opacity: 0;}
#siteHeader ul li:nth-child(2):after{width:25.46875vw; margin-left: -12.734375vw;}
#siteHeader ul li:nth-child(3):after{width:34.375vw; margin-left: -17.1875vw;}
#siteHeader ul li:nth-child(4):after{width:26.875vw; margin-left: -13.4375vw;}
#siteHeader ul li:nth-child(5):after{width:32.5vw; margin-left: -16.25vw;}

#siteFooter .footerContents {background: url(/common/images/sp/footer-bg.png); background-size: 100% auto; padding: 0 3.125 0;}
#siteFooter .footerContents h2 {background: url(/common/images/sp/footer-twitter.png) center top no-repeat; height: 17.65625vw; background-size: 100% auto;}
#siteFooter .footerContents h2 img{display: none;}
#siteFooter .copyright {font-size: 3.125vw; line-height: 15.625vw; color: #000; text-align: center; letter-spacing: 0.1em;}
#siteFooter .twitterWidget {padding: 0 4.6875vw 7.03125vw;}
#siteFooter .twitterWidget iframe {width: 90.625vw !important; height: 68.125vw !important;}
#siteFooter .bnrs {text-align: center; padding-bottom: 12.8125vw;}
#siteFooter .bnrs img {width: 80.9375vw; height: auto; margin: 0 auto;}
#siteFooter .bnrs ul li + li {margin:4.6875vw 0 0;}

#siteFooter ul.sns {z-index: 10; width: 100%; text-align: center; padding: 13.75vw 0 15.625vw;}
#siteFooter ul.sns img {width: 12.5vw; height: auto;}
#siteFooter ul.sns li {display: inline-block; padding: 0 1.875vw 0;}
#siteFooter ul.sns + .copyright {border-top:2px solid #686868;}

#pageHeader {width:100%; text-align: left; position: relative; height: 45vw; padding: 15.625vw 0 0;}
#pageHeader h1 {position: absolute; left:0; top:15.625vw; z-index: 100; margin: 0 -4.6875vw;}
#pageHeader h1 img {width: 100%; height: auto;}
#pageHeader ul.sns {display: none;}

}



/* loader */
#loader {background: rgba(255,255,255,1); width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 1999;}
.loader,.loader:after {border-radius: 50%; width: 5em; height: 5em;}
.loader {font-size: 6px; position:absolute; left: 50%; top: 50%; margin: -2.5em 0 0 -2.5em; text-indent: -9999em;
border-top: 0.3em solid rgba(244,220,36,0.3); border-right: 0.3em solid rgba(244,220,36,0.3); border-bottom: 0.3em solid rgba(244,220,36,0.3);
border-left: 0.3em solid #f4dc24;/* c27000 f4dc24*/
-webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0);
-webkit-animation: load8 1.1s infinite linear; animation: load8 1.1s infinite linear;}
@-webkit-keyframes load8 {0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
@keyframes load8 {0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}}


/******************************************************************************************************************************

	js Scripts


*/
#gridJSSW {z-index:1000000000 !important;}
#baseW {position: fixed; left: 0; bottom: 0; width: 100%; width: 100vw; height: 1px; z-index: -1111; opacity: 0;}

div[class=nicescroll-rails] ,
div[class=nicescroll-rails] div {z-index: 999999 !important; cursor: pointer;}

