@charset "utf-8";

/*=============================================================
 header
=============================================================*/
#header{
	background-color:rgba(255, 255, 255, 1);
	padding-top:22px;
	/*box-shadow:0 2px 10px rgba(0,0,0,.2);*/
	border-bottom: 1px solid #ccc;
	width:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:21;
}
#header a{color:#222;}
#header .pcMneu{display: block;}
#header .spMneu{display: none;}
/* hdr-logo
-------------------------------------------------------------*/
#hdr-logo{position:absolute;z-index: 999;}
#hdr-logo a{display: block;}

/* globalNavSet
-------------------------------------------------------------*/
#globalNavSet{position:relative;}
#globalNavSet>dt{display:none;}

/* delete JS Style */
@media only screen and (min-width:1024px){
#container{margin-top:0 !important;}
}
#globalNavSet>dd>div{
	display:flex;
	flex-wrap:wrap;
	flex-direction:row-reverse;
}
/* boxGNavBg */
.boxGNavBg{
	background:rgba(0,0,0,.5);
	position:fixed;
	top:0;
	right:0;
	bottom:0;
	left:0;
	z-index:20;
	visibility:hidden;
	opacity:0;
	transition:.2s;
}

/* globalNav
-------------------------------------------------------------*/
#globalNav{
	display:flex;
	width:100%;
	margin-top:33px;
	margin-right: 48px;
	justify-content: flex-end;
}
@media only screen and (max-width:1024px) and (min-width:1024px){
#globalNav{font-size:calc(100vw * 16 / 1024);}
}

#globalNav>li{
	line-height:1.2;
	box-sizing:border-box;
	text-align:center;
	margin:0;
	padding:0 0 0 0;
	position:relative;
}
#globalNav>li>a{
	color:#222;
	text-decoration:none;
	display:flex;
	justify-content:center;
	align-items:center;
	box-sizing:border-box;
	height:100%;
	padding:16px 16px 30px;
	position:relative;
}
/* hdr-search
-------------------------------------------------------------*/
#hdr-search{
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	width: 55px;
	height: 62px;
	bottom: 0;
	right: 0;
	z-index: 11;
}
#hdr-search #search-open-btn {

	box-sizing: border-box;
	overflow: hidden;
}
#hdr-search #search-open-btn a {
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
	text-indent: -9999px;
	background: url("/shared/img/hdr_icon_search.png") no-repeat 0 0;
	background-size: 24px 24px;
	background-position: center bottom 25px;
	position: relative;
	padding: 24px;
	box-sizing: border-box;
}
#hdr-search #search-open-btn a:hover{
	background: url("/shared/img/hdr_icon_search_o.png") no-repeat 0 0;
	background-size: 24px 24px;	
	background-position: center bottom 25px;
}
#hdr-search.btnActive #search-open-btn a{
	background: #F0F0F0 url("/shared/img/hdr_icon_search_o.png") no-repeat 0 0;
	background-size: 24px 24px;
	background-position: center bottom 25px;	
}

/*#hdr-search #search-open-btn a:before {
	content: "";
	background: #fff url("/shared/img/hdr_icon_search_o.png") no-repeat 0 0;
	background-size: 24px 24px;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	transition: all 0.4s ease 0.2s;
	opacity: 0;
}*/




@media only screen and (min-width:1024px){
#header .headerInner{
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 24px;
	position: relative;
	font-size: 14px;
}
#header nav{position: relative;}
#globalNav>li>a::after {
	content: '';
	position: absolute;
	left: 0;
	margin-left: 16px;	
	width: 0;
	box-sizing: border-box;
	bottom: 26px;
	height: 2px;
	background: #666666;
	transition: width 0.35s cubic-bezier(0.19, 1, 0.22, 1);
}
#globalNav .setDrop.act a::after{background: #C44000;}
#globalNav>li.setDrop>a::before{
	content:"";
	display:block;
	width:6px;
	height:6px;
	border-bottom:2px solid #C44000;
	border-right:2px solid #C44000;
	position:absolute;
	bottom:14px;
	left:50%;
	transform: translate(-40%, 0) rotate(45deg);
	transition: transform 0.3s ease;
}
#globalNav>li>a:hover::after,
#globalNav .setDrop.act a::after{width: calc((100% - 32px));}
html:not(.touchDevice) #globalNav>li>a:hover{color:#222 !important;}
#globalNav .setDrop a.act{
	color:#C44000 !important;
	background-color:#EDF0F5 !important;
}
#globalNav>.act>a{color:#C44000;}
#globalNav .setDrop a.act:after{contents:none;}
	
	
/* drop */
#globalNav .drop{
	display:block !important;
	background-color:#F0F0F0;
	/*background: linear-gradient(90deg, rgba(240,240,240,0) 0%, rgba(240,240,240,0) 70%, rgba(240,240,240,1.0) 70%, rgba(240,240,240,1.0) 100%);*/
	box-sizing:border-box;
	width:100%;
	transition:.25s ease-out;
	position:fixed;
	left:0;
	z-index:22;
	opacity: 0;
}

#globalNav .drop.open{
	/*padding-top:50px;
	padding-bottom:30px;*/
	visibility:visible;
	opacity:1;
	transition:.25s ease-out;
}

#globalNav .drop>*{display:none;}
#globalNav .drop.open>*{
	display:block;
	text-align: left;
}
#globalNav .drop.open .dropInner{
	position: relative;
	font-size: 14px;
}
/*#globalNav .drop.open .headerInner::before {
	content: '';
	position: absolute;
	width: 53vw;
	top: 0;
	bottom: 0;
	left: 0; 
	right: -50vw;
	z-index: 0;
	background-color: #F0F0F0;
}*/
#globalNav .drop.open::after{
	content: '';
	position: absolute;
	top:0;
	bottom: 0;
	left:0;
	right: 0;
	height: 100vh;
	z-index: -1;
	opacity: .6;
	background-color: #000;
}	

#globalNav .drop .wide-box{
	/*max-width: 760px;*/
	background-color: #EDF0F5;
	padding: 35px 45px 35px 50px;
	box-sizing: border-box;
	margin: 0 0 0 auto;
}
#globalNav .drop .wide-box .wide-item{
	display: flex;
	flex-wrap: wrap;
	column-gap: 5%;
	
	max-width: 1440px;
	margin: 0 auto;
}
#globalNav .drop .wide-box .wide-item>*{width: 30%;}
#globalNav .drop .wide-box .wide-item>*:first-child{width: 100%;}	
#globalNav .drop .wide-box .wide-item .drop-ttl{
	font-size: 18px;
	width: 100%;
	border-bottom: 3px solid #ccc;
	padding-bottom: 10px;
}
#globalNav .drop .wide-box .drop-ttl a{
	display: block;
	padding: 4px 0 4px 20px;
	position:relative;
}
/*#globalNav .drop .wide-box .drop-ttl a:hover{text-decoration: none;}*/
#globalNav .drop .wide-box .drop-ttl a::before{
	content: "";
	display: block;
	width: 6px;
	height: 6px;
	border-bottom: 2px solid #C44000;
	border-right: 2px solid #C44000;
	position: absolute;
	top: 0.65em;
	left: 0px;
	transform: rotate(-45deg);	
}
#globalNav .drop>ul{
	line-height:1.4;
	display:flex;
	flex-wrap:wrap;
}
#globalNav .drop ul li{
	padding:14px 0;
	border-bottom: 1px solid #ccc;
}
#globalNav .drop ul li a{
	display:block;
	padding: 4px 0 4px 20px;
	position:relative;
}
#globalNav .drop ul li a::before{
	content: "";
	display: block;
	width: 6px;
	height: 6px;
	border-bottom: 2px solid #C44000;
	border-right: 2px solid #C44000;
	position: absolute;
	top: 0.7em;
	left: 0px;
	transform: rotate(-45deg);	
}
	
#globalNav .drop ul.gbImg li{
	display: flex;
	column-gap: 20px;
	align-items: center;
}	
#globalNav .drop ul.gbImg li .img,
#globalNav .drop ul.gbImg li .text{display: block;width: calc((100% - 20px)/2);}
	
	
#globalNav .drop .btnClose{
  display: block;
  width: 24px;
  height: 24px;
  position: absolute;
  top: 35px;
  right: calc((50% - 720px));
  cursor: pointer;
	margin-right: 24px;
}
#globalNav .drop .btnClose::before,
#globalNav .drop .btnClose::after{
	content:"";
	box-sizing:border-box;
	width:26px;
	height:2px;
	border-top:2px solid #666;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, 0) rotate(45deg);
}
#globalNav .drop .btnClose::after{transform:translate(-50%, 0) rotate(-45deg);}

/* grandchild */
#globalNav ul ul{display:none !important;}

}
/* hdr-menu
-------------------------------------------------------------*/
#hdr-menu{
	display:flex;
	justify-content:flex-end;
	margin:10px 0 0 0;
	position:absolute;
	right:0;
	font-size: 12px;
}
#hdr-menu a:hover{color: #C44000;}

#hdr-menu>li:not(:first-child){margin-left:20px;}

/* hdr-btnInquiry */
#hdr-btnInquiry{
}
/* hdr-btnLang */
#hdr-btnLang>ul{
	display:flex;
	justify-content:flex-end;
}
#hdr-btnLang>ul .act{
	pointer-events: none;
	font-weight: 700;
}
#hdr-btnLang>ul>li:not(:first-child){margin-left:20px;}
#hdr-search-wrap{
	position:absolute;
	top:95.8px;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	color: #999;
	background: #F0F0F0;
	padding: 35px;
	box-sizing: border-box;
	z-index: -1;
	display: none;
	opacity: 0;
	transition: opacity .3s;
}	
#hdr-search-wrap.searchActive{
	position:absolute;
	display: block;
	z-index: 3;
	opacity: 1;
}
#hdr-search-wrap.searchActive:after{
	content: '';
	position: absolute;
	/* bottom: 0; */
	margin-top: 35px;
	margin-left: -35px;
	width: 100vw;
	height: 100vh;
	z-index: -1;
	opacity: .6;
	background-color: #000;
}
.hdrShrink .setShrink #hdr-search-wrap{
	position:absolute;
	/*top: 64px;*/
	top: 81px;
}
.hdr-search-ttl{
	font-size: 18px;
	color: #222;
	font-weight: normal;
	margin-bottom: 10px;
}
.hdr-search-form{position: relative;}	
.hdr-search-box{
	font-size:16px;
	width: 100%;
	height: 68px;
	padding: 0 100px 0 20px;
	border: 1px solid #cccccc;
	box-sizing: border-box;
}	
.hdr-search-btn{
	position: absolute;
	top:14px;
	right: 12px;
	font-weight: 700;
	cursor: pointer;
	border: none;
	outline: none;
	padding: 0;
	appearance: none;
}
.hdr-search-btn span{
	display: block;
	position: relative;
	padding: 10px 20px;
	box-sizing: border-box;
	border: 2px solid #C44000;
	width: 100px;
	height: 40px;
	background: #C44000;
	color: #fff;
	/*background: #fff;
	color: #C44000;*/
	overflow: hidden;
	z-index: 1;
}
.hdr-search-btn span::after {
	content: '';
  /*background: #C44000;*/
	background: #fff;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}
.hdr-search-btn span:hover {color: #C44000;}
.hdr-search-btn span:hover::after {transform: scale(1, 1);}

	
/*#hdr-search-wrap .mt-site-search-form__button:hover{
	opacity: .6;
}*/
#hdr-search-wrap .mt-site-search-form__query {
	width: 320px;
	height: 32px;
	padding: 0 8px;
	border: 1px solid #cccccc;
}

#hdr-search-wrap .mt-site-search-form__button {
	width: 100px;
	height: 40px;
}
#hdr-search-wrap .closePlate{
	position: absolute;
	width: 50px;
  height: 50px;
	right: 30px;
	top: 45px;
  transform: translateY(-50%);
	cursor: pointer;
}
#hdr-search-wrap .closePlate>span{
	display: block;
	text-indent: -9999px;
}
#hdr-search-wrap .closePlate::before,
#hdr-search-wrap .closePlate::after{
	content:"";
	background-color:#666;
	display:block;
	width:26px;
	height:2px;
	position:absolute;
	top:24px;
	left:50%;
	margin-left:-10px;
	z-index:1;
}
#hdr-search-wrap .closePlate::before{transform:rotate(45deg);}
#hdr-search-wrap .closePlate::after{transform:rotate(-45deg);}
/* header shrink
-------------------------------------------------------------*/
@media only screen and (min-width:1024px){
.setShrink#header,
.setShrink #hdr-logo,
.setShrink #globalNavSet,
.setShrink #globalNav,
.setShrink #hdr-menu,
.setShrink #hdr-search,
.setShrink #hdr-search-wrap,
#sideMenu #sideMenuBar{transition:all 0.2s ease-out;}

.hdrShrink #sideMenu #sideMenuBar{top:68px;}
	
.hdrShrink .setShrink#header{
	padding-top:5px;
}
.setShrink #hdr-logo{}
.hdrShrink .setShrink #hdr-logo{
	width:40px;
	top:50%;
	transform:translate(0,-50%);
}
.hdrShrink .setShrink #hdr-logo img{max-width:180px;}
.hdrShrink .setShrink #globalNavSet{
	margin-left:60px;
}
.hdrShrink .setShrink #globalNav{
	margin-top:0;
}
.hdrShrink .setShrink #hdr-menu{
	visibility:hidden;
	opacity:0;
	transform:translate(0, -30px);
}
	
	
	
}


/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Smartphones
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:1023px){

#header{
	height:80px;
	padding-top:0;
}
#header>.headerInner{
	display:flex;
	align-items:center;
	height:100%;
	padding: 0 24px;
}	
#header .pcMneu{display: none;}	
#header .spMneu{display: block;}		
/* hdr-logo
-------------------------------------------------------------*/
#hdr-logo{
	width:180px;
	position:static;
}
/* globalNavSet
-------------------------------------------------------------*/
#globalNavSet{position:static;}
#globalNavSet a{color:#222;}
#globalNavSet>dt{
	display:block;
	width:55px;
	height:80px;
	position:absolute;
	top:0;
	right:0;
	cursor:pointer;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}
#globalNavSet>dt::before,
#globalNavSet>dt::after{
	content:"";
	background-color:#333;
	display:block;
	width:20px;
	height:2px;
	position:absolute;
	top:39px;
	left:50%;
	margin-left:-10px;
	z-index:1;
}
#globalNavSet>dt>span::before{
	content:"";
	width:20px;
	height:13px;
	margin-left:-10px;
	border-top:2px solid #333;
	border-bottom:2px solid #333;
	top:32px;
	left:50%;
	position:absolute;
}
#globalNavSet>dt>span .open,
#globalNavSet.open>dt>span .close{display:none;}
#globalNavSet.open>dt>span .open{display:inherit;}
#globalNavSet>dt::before,
#globalNavSet>dt::after,
#globalNavSet>dt>span{
	transition:all 0.3s ease;
}
#globalNavSet.open>dt>span::before{border-color:rgba(255,255,255,0);}
#globalNavSet.open>dt::before{transform:rotate(45deg);}
#globalNavSet.open>dt::after{transform:rotate(-45deg);}
#globalNavSet>dt>span>span{display:none;}
#globalNavSet>dd{
	color:#222;
	background-color:#fff;
	box-sizing:border-box;
	width:100%;
	visibility:hidden;
	overflow:hidden;
	position:fixed;
	top:80px;
	bottom:100%;
	left:0;
	z-index:71;
	opacity:0;
	transition:all 0.3s ease;
	height:0;
}
#globalNavSet.open>dd{
	height:calc(100vh - 50px);
	visibility:visible;
	/*bottom:0;*/
	opacity:1;
	background: #EDF0F5;
}
#globalNavSet>dd>div{display:block;}
#globalNavSet>dd>*{visibility:hidden;}
#globalNavSet.open>dd>*{visibility:inherit;}
html.gNavOpen,
html.gNavOpen body{
	height:100%;
	overflow:hidden;
}
html.gNavOpen #globalNavSet>dd>div{
	box-sizing:border-box;
	width:100%;
	height:100%;
	overflow:auto;
	position:relative;
	-webkit-overflow-scrolling:touch;
}
/* set drawer animation */
#globalNavSet.setOpenDrawerR>dd{
	height:calc(100vh - 80px);
	left:100%;
	bottom:0;
}
#globalNavSet.setOpenDrawerR.open>dd{left:0;}

/* boxGNavBg */
html.gNavOpen .boxGNavBg{
	visibility:visible;
	opacity:1;
}
#hdr-search-wrap.searchActive:after{
	margin-top:20px;
	margin-left:0;
	left: 0;
}
/* hdr-search
-------------------------------------------------------------*/
#hdr-search{
	display: block;
	width: 50px;
	height: 80px;
	bottom: 0;
	right: 55px;
	z-index: 11;
}
#hdr-search #search-open-btn a{
	background-position: center center;
	height: 80px;
}
#hdr-search #search-open-btn a:hover {background-position: center center;}
#hdr-search-wrap{
	padding: 20px;
}
	
.hdr-search-ttl{font-size: 14px;}
.hdr-search-box{height: 40px;}
.hdr-search-btn{
	height: 30px!important;
	top: 5px;
  right: 5px;
	padding: 0;
}
.hdr-search-btn span{
	padding: 5px 20px;
	height: 30px;
}
#hdr-search-wrap.searchActive{top:80px;}
#hdr-search-wrap .closePlate{
	right: 20px;
	top: 20px;
}
/* globalNav
-------------------------------------------------------------*/
#globalNav{
	display:block;
	border-top:1px solid #d4d4d4;
	margin-top:0;
}
#globalNav>li{
	text-align:left;
	padding:0 !important;
	border-bottom:1px solid #d4d4d4;
	background: #EDF0F5;
}
#globalNav>li:before,
#globalNav>li:last-child:after{display:none;}
#globalNav>li>a,
#globalNav li a+.toggle-btn	{
	color:#222 !important;
	font-weight:bold;
	box-sizing:border-box;
	display:block;
	/*padding:10px calc(4% + 12px) 10px 4%;*/
	padding:14px 40px 14px 15px;
}
#globalNav li li li .toggle-btn{padding:10px 40px 10px 15px;}
#globalNav li a:hover,
#globalNav .setDrop a.act{background:none !important;}
/*#globalNav li ul{
	margin-left:4%;
	padding:3px 0 25px 10px;
	border-top:1px solid #aaa;
}*/
#globalNav li .wide-item{
	margin-left:0;
	padding:0;
	border-top:1px solid #aaa;
}
#globalNav li .wide-item li:not(:last-child){	
	text-align: left;
	padding: 0 !important;
	border-bottom: 1px solid #ccc;
}
#globalNav li .wide-item ul + ul{border-top: 1px solid #ccc;}	
#globalNav li .wide-item li a{
	display: block;
	padding: 12px 40px 12px 15px;
	box-sizing: border-box;
}	
#globalNav li .wide-item li a:hover{text-decoration: none;}	
#globalNav li .wide-item li li a{padding: 10px 40px 10px 0;}	
#globalNav li .wide-item li li li a{padding: 10px 40px 10px 0;}	
#globalNav li .wide-item .drop-ttl{display: none;}
/*#globalNav li li{margin-top:8px;}*/

	
#globalNav .drop ul.gbImg li{display: block;}	
#globalNav .drop ul.gbImg li .img{display: none;}
	
/* act */
#globalNav>li>a::after{display:none !important;}

/* toggle-btn */
#globalNav .toggle-set{position:relative;}
#globalNav .toggle-btn{
	text-indent:200px;
	width:30px;
	overflow:hidden;
	position:absolute;
	top:0;
	right:0;
}
#globalNav .toggle-btn::before{
	content: '';
	width: 1px;
	background: #ccc;
	position: absolute;
	top:14px;
	bottom: 14px;
	left:0;
}		
#globalNav .toggle-btn::after{
	content:"";
	box-sizing:border-box;
	width:8px;
	height:8px;
	border-right:1px solid #CE4B00;
	border-bottom:1px solid #CE4B00;
	position:absolute;
	top:15px;
	right:20px;
	left:inherit;
	transform:translate(-40%, 0) rotate(45deg);
	transition:transform 0.3s ease;
}
#globalNav .open>.toggle-box .toggle-set.open .toggle-set .toggle-btn::after{transform: translate(-40%, 0) rotate(45deg);top: calc((50% - 5px));}
#globalNav .open>.toggle-btn::after,
#globalNav .open>.toggle-box .toggle-set.open .toggle-btn::after,
#globalNav .open>.toggle-box .toggle-set.open .toggle-set.open .toggle-btn::after{transform:scaleY(-1) translate(-40%, 0) rotate(45deg);top: 20px;}
/*#globalNav .toggle-set.open>.toggle-box .toggle-set .toggle-btn::after{transform: translate(-40%, 0) rotate(45deg);}
#globalNav .toggle-set.open>.toggle-box .toggle-set.open .toggle-btn::after,
#globalNav .toggle-set.open>.toggle-box .toggle-set.open .toggle-set.open .toggle-btn::after{transform:scaleY(-1) translate(-40%, 0) rotate(45deg);top: 20px;}	
#globalNav ul .toggle-btn::after{
	top:5px;
	right:0;
}*/
#globalNav ul .toggle-set.open .toggle-btn+ul,
#globalNav ul .toggle-set.open .text+ul{
	border-top: 1px solid #ccc;
	padding-left: 30px;
}
#globalNav ul .toggle-set>a{
	display:inline-block;
	padding-right:12px;
	/*pointer-events:none;*/
}
#globalNav .toggle-set.open>.toggle-box{background: #fff;}
	
/* hdr-menu
-------------------------------------------------------------*/
#hdr-menu{
	flex-wrap:wrap;
	justify-content:center;
	text-align:center;
	margin:5px 15px 20px;
	position:static;
}
#hdr-menu>li{margin:15px 0 15px!important;}
	
/* hdr-btnInquiry */
#hdr-btnInquiry{display: none;}
	
/* hdr-btnLang */
#hdr-btnLang>ul{
	display:flex;
	justify-content:flex-end;
}
#hdr-btnLang>ul>li:not(:first-child){margin-left:20px;}
	
/* hdr-gbDrop
-------------------------------------------------------------*/
.hdr-gbDrop{display:none !important;}



	
}