@charset "UTF-8";
header *, header *:before, header *:after{ box-sizing:border-box; }
body {}

/*!------------------------------------*\
    Header
\*!------------------------------------*/
/* PC Header */
#header {
	width:100%;
	position:fixed !important;
	height:115px;
	top:0;
	left:0;
	z-index:9999;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	box-shadow: 0px 7px 3px -3px rgba(0,0,0,0.2);
  -webkit-box-shadow: 0px 7px 3px -3px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 7px 3px -3px rgba(0,0,0,0.2);
  
}

#gnavi_area {}
#gnavi_area_bg {height:115px; background-color:#fff; text-align:center;}
#gnavi_area_con {max-width:1030px; padding:0 10px; margin:0 auto; text-align:left; background-color:#fff;}
#gnavi_area_con #header_logo {width:115px; height:115px; padding:10px 0; float:left;}
#gnavi_area_con #header_logo h1 {padding:0; margin:0; line-height:1;}
#gnavi_area_con #header_logo h1 img {width:93px; height:93px;}
#header #gnavi_area ul#pc_naviul {
	display:inline-block;
	font-size:0;
	float:right;
	height:93px;
	padding-top:25px;
	}
	
#header #gnavi_area ul li {display:inline-block; font-size:12px; font-size:1.3rem; text-align:center; font-weight:bold; margin:0 0 0 0px; padding:0 12px; line-height:1.4; border-right:solid 1px #CFCFCF;}
#header #gnavi_area ul li.subbtn{ margin-top:0; padding:0 0 0 10px; border:none;}
#header #gnavi_area ul li.subbtn a:hover{border:none;}
#header #gnavi_area ul li a,#header #gnavi_area ul li a:visited {
	color:#333;	
	text-decoration:none;
	padding-bottom:10px;}
#header #gnavi_area ul li span.en{
	font-family:'Lucida Grande','Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	text-align:center;
	font-size:10px;
}
#header #gnavi_area ul li span.en:before{
	content: "\A" ;
	white-space: pre;

}	
	
#header #gnavi_area ul li a:hover,#header #gnavi_area ul li.drop_current a {color:#333333; border-bottom:3px solid #839cc9; padding-bottom:30px;}
#header #gnavi_area ul li ul {clear:both; display:none;}
#header #gnavi_area ul li li {float:none; line-height:1;}

/* PC Dropdown */
#header #pc_dropdown_area {width:100%; text-align:center; display:none;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CCFFFFFF,endColorstr=#CCFFFFFF);
  background: rgba(18, 50, 108, 0.90);
}
#header #pc_dropdown_area:not(:target){filter:none;}
#header #pc_dropdown_con {max-width:960px; padding:0 20px; margin:0 auto; text-align:left;}
#header #pc_drop01 {display:none;}
#header #pc_drop02 {display:none;}
#header #pc_drop03 {display:none;}
#header #pc_drop04 {display:none;}
#header #pc_drop05 {display:none;}
#header #pc_drop06 {display:none;}
#header #pc_drop07 {display:none;}
#header .pc_drop_area {color:#FFF; padding:15px 0 15px 0;}
#header #pc_dropdown_con ul {font-size:0;}
#header #pc_dropdown_con ul li {width:25%; font-size:12px; font-size:1.20rem; margin:0; padding:0 0px 0px 0px; font-weight:bold; border-right:solid 1px #fff; text-align:center; vertical-align:middle;}
#header #pc_dropdown_con ul li a,#header #pc_dropdown_con ul li a:visited {color:#FFF; text-decoration:none;}
#header #pc_dropdown_con ul li a:hover {color:#ccc; text-decoration:none; border:none;}
#header #pc_dropdown_con ul li a img {max-width:76px; border:1px solid #ececec;}
#header #pc_dropdown_con dl {}
#header #pc_dropdown_con dd {margin:0; height:76px; max-height:76px; padding:0 0 0 10px; text-align:center;}
#header #pc_dropdown_con #pc_drop04 {font-size:0;}
#header #pc_dropdown_con .col4 {width:25%; display:inline-block; vertical-align:top;}
#header #pc_dropdown_con .col4 .pc_drop_area_subtitle {width:100%; padding:0 15px 20px 0;}
#header #pc_dropdown_con .col4 .pc_drop_area_subtitle.second_title {padding:20px 15px 20px 0;}
#header #pc_dropdown_con .col4 .pc_drop_area_subtitle p {color:#595959; font-size:14px; font-size:1.4rem; font-weight:bold; padding-bottom:5px; border-bottom:1px solid #b5b5b5;}
#header #pc_dropdown_con .col4 ul li {width:100%;}

/* SP Header */
#sp_header {background-color:#12326c; z-index:12; display:none; position:fixed; overflow:hidden; top:0; width:100%;}
#sp_header h1 {max-width:150px; float:left; margin-top:7px;}
#sp_header h1 img {width:150px; height:47px;}
#sp_header button {float:right; padding:0; max-width:98px; margin-top:10px;}
#sp_header button img {width:98px; height:50px;}



/* SP drawer-menu */
/*!
 * jquery-drawer v3.1.0
 * Flexible drawer menu using jQuery, iScroll and CSS.
 * http://git.blivesta.com/drawer
 * License : MIT
 * Author : blivesta <design@blivesta.com> (http://blivesta.com/)
 */
/* Base */
.drawer-nav { position: fixed; z-index: 101; top: 0; overflow: hidden; width:85%; height: 100%; color:#FFF; background-color:#12326c;}
.drawer-brand {font-size:12px; font-size:1.2rem; font-weight: bold; line-height:16px; display: block; padding-right: .75rem; padding-left: .75rem; text-decoration: none; color: #FFF;}
.drawer-menu {margin:0; padding:0; list-style:none;}
.drawer-menu li {position:relative; border:1px solid #FFF; border-width:0 0 1px 0;}

.drawer-menu-item {font-size:12px; font-size:1.2rem; line-height:16px; display:block; padding:19px 16px; text-decoration:none; color:#FFF; font-weight:bold;}
a.drawer-menu-item,a:visited.drawer-menu-item {font-size:12px; font-size:1.2rem; line-height:16px; text-decoration:none; color:#FFF; font-weight:bold;}
.drawer-menu-item:hover,.drawer-menu-item:active {text-decoration:none; color:#FFF; background-color:transparent;}

/*! overlay */
.drawer-overlay {position:fixed; z-index:100; top:0; left:0; display:none; width:100%; height:100%; background-color:rgba(0,0,0,0.7);}
.drawer-open .drawer-overlay {display:block;}

/* Right */
.drawer--right .drawer-nav {
  right: -85%; -webkit-transition: right .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); transition: right .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);}
.drawer--right.drawer-open .drawer-nav,
.drawer--right .drawer-hamburger,
.drawer--right.drawer-open .drawer-navbar .drawer-hamburger {right:0;}
.drawer--right.drawer-open .drawer-hamburger {right:85%;}
/*!------------------------------------*\
    Hamburger
\*!------------------------------------*/
.drawer-hamburger {position:fixed; z-index:104; top:0; display:block; box-sizing:content-box; width:3rem; padding:0; padding-top:18px; padding-right:.75rem; padding-bottom:30px; padding-left:.75rem;
  -webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); -webkit-transform: translate3d(0, 0, 0); transform:translate3d(0, 0, 0); border: 0; outline: 0; background-color: transparent;}

.drawer-hamburger:hover {cursor:pointer; background-color:transparent;}
.drawer-hamburger-icon {position:relative; display:block; margin-top:10px;}
.drawer-hamburger-icon,
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {width:100%; height:2px; -webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000); background-color: #FFF;}
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {position:absolute; top: -10px; left: 0; content: ' ';}
.drawer-hamburger-icon:after {top:10px;}
.drawer-open .drawer-hamburger-icon { background-color:transparent;}
.drawer-open .drawer-hamburger-icon:before,
.drawer-open .drawer-hamburger-icon:after {top:0;}
.drawer-close .drawer-hamburger,.drawer-hamburger {display:none;}
.drawer-open .drawer-hamburger {display:block;}
.drawer-open .drawer-hamburger-icon:before {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.drawer-open .drawer-hamburger-icon:after {
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
/*!------------------------------------*\
    Dropdown
\*!------------------------------------*/
.drawer-dropdown-menu { display:none; box-sizing:border-box; width:100%; margin:0; padding:0; background-color: #fff;}
.drawer-dropdown-menu > li { width:100%; padding:8px; list-style:none; border-bottom:1px solid #e6e6e6;}
.drawer-dropdown-menu > li:last-child {border-bottom:none;}
.drawer-dropdown-menu dl {}
.drawer-dropdown-menu dl dt, .drawer-dropdown-menu dl dd {display:table-cell; vertical-align:middle;}
.drawer-dropdown-menu dt {float:left;}
.drawer-dropdown-menu dd { margin-left:54px; height:40px; padding-top:0;}
.drawer-dropdown-menu-item { font-size:12px; font-size:1.2rem; line-height:16px; display:block; text-decoration:none; color:#595959;}
a.drawer-dropdown-menu-item,a:visited.drawer-dropdown-menu-item { font-size:12px; font-size:1.2rem; line-height:16px; display:block; text-decoration:none; color:#595959;}
.drawer-dropdown-menu-item img {width:52px; height:40px; padding-right:12px;}
.drawer-dropdown-menu-item:hover,.drawer-dropdown-menu-item:active {text-decoration:none; color:#999; background-color:transparent;}
.drower-headermenu-area {padding:2.3% 0; font-size:9px; font-size:0.9rem; line-height:12px;}
.drower-headermenu-area img {max-width:68px;}
/* .drower-headermenu-area img {max-width:48px;} */
.drower-headermenu-login {border:none; width:25.2%; text-align:center; float:left; padding:0; padding:0 5.8% 0 5.8%; box-sizing:border-box;}
.drower-headermenu-mailmaga {border:none; width:21.1%; text-align:center; float:left; padding:0; padding:0 7.5% 0 0; box-sizing:border-box;}
.drower-headermenu-favorite {border:none; width:19.1%; text-align:center; float:left; padding:0; padding:0 5.5% 0 0; box-sizing:border-box;}
.drower-headermenu-cart {border:none; width:16.9%; text-align:center; float:left; padding:0; padding:0 3.3% 0 0; box-sizing:border-box;}
.drower-headermenu-search {border:none; width:17.7%; text-align:center; float:left; padding:0; padding:0 4.1% 0 0; box-sizing:border-box;}
.drower-headermenu-text {padding:8px 0 0 0;}
.drower-headermenu-area a,.drower-headermenu-area a:hover,.drower-headermenu-area a:active {color:#FFF; text-decoration:none;text-align:center;}

.drower-headermenu-area02 {padding:2.3% 0; font-size:9px; font-size:0.9rem; line-height:12px;}
.drower-headermenu-area02 img {max-width:68px;}
/* .drower-headermenu-area02 img {max-width:48px;} */
.drower-headermenu-area02 .drower-headermenu-login {border:none; width:44.1%; text-align:center; float:left; padding:0; padding:0 5.8% 0 24.9%; box-sizing:border-box;}
.drower-headermenu-area2 .drower-headermenu-mailmaga {border:none; width:50%; text-align:center; float:left; padding:0; padding:0 4% 0 0; box-sizing:border-box;}
.drower-headermenu-area2 .drower-headermenu-search {border:none; width:50%; text-align:center; float:left; padding:0; padding:0 4% 0 0; box-sizing:border-box;}
.drower-headermenu-text {padding:8px 0 0 0;}
.drower-headermenu-area02 a,.drower-headermenu-area02 a:hover,.drower-headermenu-area02 a:active {color:#FFF; text-decoration:none;text-align:center;}

#dropdown-search {display:none;}
#dropdown-search {background-color:#d7d7d7;}
#dropdown-search #search_box {width:100%; padding:15px 16px;}
#dropdown-search #search_box form {}
#dropdown-search #search_box #search_textbox {width:75%;height:30px; background:#FFF; border:none; border-radius:0; padding:0 10px; color:#444; font-size:14px; font-size:1.4rem; margin-top:-1px; vertical-align:middle;}
#dropdown-search #search_box #search_submitbtn {width:25%;height:30px; background-color:#df0623; vertical-align:middle; font-weight:bold; color:#FFF;font-size:14px; font-size:1.4rem;}
#dropdown-search #search_box #search_submitbtn:active {background-color:#950014;}
/*! open */
.drawer-dropdown.open > .drawer-dropdown-menu {display:block;}
.drawer-dropdown.open .drawer-caret {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}
/*! drawer-caret */
.drawer-dropdown .dropdown_btn {border-left:1px solid #fff; position:absolute; top:0; right:0; width:54px; height:54px;background-color:#071f4b;}
.drawer-dropdown .drawer-caret {
  display: inline-block;
  width:54px;
  height:54px;
  margin:0;
  -webkit-transition: opacity .2s ease, -webkit-transform .2s ease;
  transition: opacity .2s ease, -webkit-transform .2s ease;
  transition: transform .2s ease, opacity .2s ease;
  transition: transform .2s ease, opacity .2s ease, -webkit-transform .2s ease;
  -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
          transform: rotate(0deg);
  vertical-align: middle;
background-image:url(../images/navi/dropdown_icon.svg);
background-size:100%;
background-position:center center;
}


/*!------------------------------------*\
    GOTO PAGETOP
\*!------------------------------------*/
div.gotop {width:76px; height:76px; position:absolute; right:10px; bottom:10px; z-index:999; background-color:transparent;}

/*!------------------------------------*\
    Tablet
\*!------------------------------------*/
@media screen and (max-width: 979px) {
#header {display:none;}
#sp_header {display:block;}
}



/*!------------------------------------*\
    スマートフォン
\*!------------------------------------*/
@media screen and (max-width: 639px) {
/*!------------------------------------*\
    GOTO PAGETOP
\*!------------------------------------*/
div.gotop {width:60px; height:60px; right:10px; bottom:10px;}
div.gotop img{ width:100%; vertical-align: middle;}
}