@charset "utf-8";

/* --------------------------------------------------------- */
/* base.css */
/* --------------------------------------------------------- */

body{position:relative;}
#pageHeight{position:fixed;width:0;left:0;top:0;height:100%;}

*{box-sizing:border-box;}

#wrap{position:relative;}
.section{position:relative;width:100%;min-width:960px;margin:0 auto;z-index:1;}
.content{width:960px;margin:0 auto;}
.layer{width:960px;margin:0 auto;}

.white{background:#fff;}
.blue{background:#3171b9;}

.float:after{content:'';display:block;clear:both;}
.float .left{float:left;}
.float .right{float:right;}

.flex{display:-webkit-box;display:-ms-flexbox;display:flex;}
.flex.wrap{-ms-flex-wrap:wrap;flex-wrap:wrap;}
.flex.reverse{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse;}
.flex.just{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;}
.flex.center{-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
.flex.end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;}

a{display:block;text-decoration:none;transition:opacity ease 0.3s;}
a:hover{opacity:0.8;}

img{width:100%;height:auto;}

.sp{display:none;}
#spJudge{width:0;margin:0 auto;}

/* ヘッダー
----------------------- */
#header{position:relative;z-index:20;}
#header .content{width:100%;}
#header a{display:block;}
#header a:hover{opacity:0.7;}

#header .blue .layer{display:flex;align-items:center;justify-content:space-between;}
#header .logo1{width:118px;}
#header .logo2{width:240px;padding:14px 0;}

#header #spwrap{width:100%;}
#header #spwrap.fix{position:fixed;top:0;left:0;}

#header .white{}
#header .globalwrap{padding:20px 0;}
#header .global{position:relative;width:960px;margin:0 auto;z-index:2;}
#header .global:after{content:'';display:block;clear:both;}
#header .global li{width:16.25%;float:left;margin-right:0.5209%;}
#header .global li:nth-child(3){margin-right:0.4167%;}
#header .global li:last-child{float:none;margin-right:0;position:absolute;top:0;right:0;}

/* グローバルメニュー
----------------------- */
#global{background:#fff;}
#global.fixed{position:fixed; top:0; bottom:auto; z-index:6;}
#global .content{padding:20px 0;}
#global li{}

/* カタログ
----------------------- */
#catalog{margin-bottom:77px;}
#catalog p{color:#444;font-size:18px;line-height:1.334em;text-align:center;margin-bottom:5.209%;}
#catalog ul{width:65.418%;margin:0 auto;}
#catalog li{width:47.453%;max-width:298px;margin:0 auto;}
#catalog li a{padding:14px;color:#626262;font-size:18px;text-align:center;border:8px solid #eeeeee;text-decoration:none;background:rgba(255,255,255,0.5);}
#catalog li a img{width:24px;margin:0 auto 10px;}
#catalog li a span{display:block;}
#catalog li a:hover{background-color:#eeeeee;opacity:1;}

/* ページトップ
----------------------- */
#pagetop{position:relative;}
#pagetop p{position:fixed;min-width:0;bottom:10px;right:10px;width:42px;z-index:5;cursor:pointer;transition:margin ease 0.3s;}

#pagetop.fixed p{position:absolute;}

/* フッター
----------------------- */
#footer{background:#3171b9;}
#footer .content{padding:32.5px 0;}
#footer .copy{color:#fff;}
#footer .logo{max-width:240px;}

@media screen and (max-width: 750px){

#wrap{overflow:hidden;}
.section{min-width:1px;}
.content{width:94.668%;}
.layer{width:94.668%;}

a:hover{opacity:1;}

.pc{display:none;}
.sp{display:block;}
.flex.sp{display:-webkit-box;display:-ms-flexbox;display:flex;}
#spJudge{width:10px;}

.perfectScroll{position:absolute;left:0;top:0;display:block;width:100%;height:100%;z-index:6;}

/* ヘッダー
----------------------- */
#header a:hover{opacity:1;}

#header .logo1{width:16.6198%;}
#header .toggle{width:9.86%;padding-top:9.86%;margin:0 7.465% 0 auto;background:url(../img/toggle-open.png) no-repeat center;background-size:100% auto;cursor:pointer;}
#header .toggle.open{background-image:url(../img/toggle-close.png);}
#header .logo2{width:37.606%;padding:0;}

#header .white{}
#header .white .layer{width:100%;position:relative;}
#header .white .perfectScroll{position:absolute;left:0;width:100%;top:0;height:0;z-index:2;overflow:hidden;}
#header .white .globalwrap{display:none;position:relative;width:100%;margin:0 auto;padding:4% 0 5.3334%;overflow:hidden;}
#header .white .globalwrap:before{content:'';display:block;position:absolute;top:0;left:2.667%;bottom:0;width:94.667%;margin:0 auto 5.3334%;border-radius:4vw;background:#fff;box-shadow:2vw 2vw 2vw 1vw rgba(51,51,51,0.25);z-index:1;}

#header .global{width:94.6667%;padding-bottom:1.3334%;}
#header .global li{width:48.5916%;margin-right:auto;margin-left:1.4085%;padding-bottom:2.817%;}
#header .global li:nth-child(even){margin-left:0;}
#header .global li:nth-child(3){margin-right:auto;}
#header .global li:last-child{float:left;margin-right:auto;position:relative;top:auto;right:auto;}

#header .ps-container>.ps-scrollbar-y-rail{width:6px;border-radius:3px;right:2vw!important;}
#header .ps-container>.ps-scrollbar-y-rail>.ps-scrollbar-y{width:6px;border-radius:3px;background-color:#3171b9;}
#header .ps-container:hover>.ps-scrollbar-y-rail:hover>.ps-scrollbar-y{background-color:#3171b9;}

/* グローバルメニュー
----------------------- */
#global{background:none;}
#global .content{padding:0;}

#global #spheader{width:100%;padding:2% 2.7%;background:#3171b9;}
#spheader .title{width:19.452%;padding:2.889% 0;}
#spheader .logo{width:32%;min-width:120px;}

.shadow{}

/* カタログ
----------------------- */
#catalog{margin-bottom:5.334%;}
#catalog p{font-size:3.2vw;line-height:1.25em;margin-bottom:6.339%;}
#catalog ul{width:100%;display:block;}
#catalog li{width:100%;max-width:100%;margin-bottom:1.409%;}
#catalog li a{padding:2.2%;font-size:13px;border:4px solid #eee;}
#catalog li a img{width:24px;margin:0 auto 3%;}
#catalog li a span{}

/* ページトップ
----------------------- */
#pagetop p{width:5%;min-width:30px;}
body.show #pagetop p{margin-bottom:16%;}

/* フッター
----------------------- */
#footer{}
#footer .content{display:block;padding:4.6% 0;}
#footer .copy{margin-top:2.5%;}
#footer .logo{width:32%;min-width:120px;}

}

@media screen and (max-width: 480px){

}