@charset "utf-8";

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td { margin: 0; padding: 0; }
body {font-size:16px; line-height:150%; font-family:'ヒラギノ角ゴ ProN W3',"Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;   /* background:#ffeff8; */background:#fff; color:#3c3c3c;-webkit-font-smoothing: antialiased; /*chrome、safari*/-moz-osx-font-smoothing:grayscale;/*firefox*/}
ul,ol,li,dl,dt,dd{list-style: none;}
fieldset,img { border: 0; vertical-align: middle; overflow: hidden; }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { *zoom:1;}
.clear { clear: both; display: block; height: 0; overflow: hidden; }
img{ max-width:100%;}





#wrap{ margin: 0; width:1000px; }

#wrap .container{ padding-bottom:60px; }

.left_mob{ float:left; width:200px; padding:0 4% 0 6%; position:relative; }
.line_f01{ position:absolute; top:-29px; left:-61px;}
.line_f02{ position:absolute; top:294px; right:-53px; z-index:30;}
.tit_name{ padding:40% 0 26.5% 0;}

.menu{ padding-bottom:72.5%;}
.sp_menu{ display:none;}

.menu li a{ display:block; height:0; padding-bottom:25%; background-size:100% auto!important;}
.menu li.menu_01 a{ background:url(../images/menu_01_off.png) 0 0 no-repeat;}
.menu li.menu_02 a{ background:url(../images/menu_02_off.png) 0 0 no-repeat;}
.menu li.menu_03 a{ background:url(../images/menu_03_off.png) 0 0 no-repeat;}
.menu li.menu_04 a{ background:url(../images/menu_04_off.png) 0 0 no-repeat;}
.menu li.menu_05 a{ background:url(../images/menu_05_off.png) 0 0 no-repeat;}
.menu li.menu_06 a{ background:url(../images/menu_06_off.png) 0 0 no-repeat;}

.menu li.menu_01 a:hover{ background:url(../images/menu_01_on.png) 0 0 no-repeat;}
.menu li.menu_02 a:hover{ background:url(../images/menu_02_on.png) 0 0 no-repeat;}
.menu li.menu_03 a:hover{ background:url(../images/menu_03_on.png) 0 0 no-repeat;}
.menu li.menu_04 a:hover{ background:url(../images/menu_04_on.png) 0 0 no-repeat;}
.menu li.menu_05 a:hover{ background:url(../images/menu_05_on.png) 0 0 no-repeat;}
.menu li.menu_06 a:hover{ background:url(../images/menu_06_on.png) 0 0 no-repeat;}

.menu li.menu_01 a.sel{ background:url(../images/menu_01_on.png) 0 0 no-repeat;}
.menu li.menu_02 a.sel{ background:url(../images/menu_02_on.png) 0 0 no-repeat;}
.menu li.menu_03 a.sel{ background:url(../images/menu_03_on.png) 0 0 no-repeat;}
.menu li.menu_04 a.sel{ background:url(../images/menu_04_on.png) 0 0 no-repeat;}
.menu li.menu_05 a.sel{ background:url(../images/menu_05_on.png) 0 0 no-repeat;}
.menu li.menu_06 a.sel{ background:url(../images/menu_06_on.png) 0 0 no-repeat;}



.l_cdm{ padding-bottom:24%;}
.img_cd{ padding:7.5%;}
.ban_sns{ position:relative; width:100%;}
.ban_twi{ position:absolute; left:83px; top:0; display:block; height:26px; width:26px;}
.ban_face{position:absolute; left:124px; top:0; display:block; height:26px; width:26px;}
.ban_lin{ margin-top:23%; display:block;}


.right_mob{ float:left; width:700px; position:relative; }
.slide_inner{ display:none;}
.con_inner{ padding-top:33px; position:relative; z-index:35;}
.tit_fon{ padding-bottom:10px;}
.tit_fon img{ height:23px;}
.inner_l{ float:left; width:43.3%; padding:0 2.82% 0  4.28%; font-size:11px; line-height:24px;}

.inner_l p a{ color: inherit; text-decoration:none;}
.inner_l p a:hover{ text-decoration: underline;}

.inner_r{float:left; width:49.6%;}

.page .con_inner{padding:33px 2.82% 0  4.28%; }
.page .tit_fon{ padding-bottom:30px;}
.txt_in{font-size:11px; line-height:24px; padding-bottom: 3em;}

.pagebanmob{ display: flex;justify-content: center; padding: 30px 0;}
.pagebanmob a,.pagebanmob span{ width: 1.8em; text-align: center; text-decoration: none;color: #000; border: 0px solid #000; font-weight: bold;margin:0.2em; font-weight: 400; font-size: 1em; line-height: 1.5em;}
.pagebanmob span{ border: 0; }
.pagebanmob a:hover{background: #000; color: #fff;}


/* letter */
.slph{ display:none;}
.sl_ban{ text-align:center}
.sl_ban a{ display: inline-block;padding-bottom:6.857%; background-size:100% auto!important;}
.nav_01{ width:20.28%; background-image:url(../images/letter/nav_01_off.jpg)}
.nav_02{ width:14.14%; background-image:url(../images/letter/nav_02_off.jpg)}
.nav_03{ width:10.57%; background-image:url(../images/letter/nav_03_off.jpg)}
.nav_04{ width:10.57%; background-image:url(../images/letter/nav_04_off.jpg)}
.nav_05{ width:13.71%; background-image:url(../images/letter/nav_05_off.jpg)}
.nav_06{ width:26.43%; background-image:url(../images/letter/nav_06_off.jpg)}

.nav_01.sel{background-image:url(../images/letter/nav_01_on.jpg)}
.nav_02.sel{background-image:url(../images/letter/nav_02_on.jpg)}
.nav_03.sel{background-image:url(../images/letter/nav_03_on.jpg)}
.nav_04.sel{background-image:url(../images/letter/nav_04_on.jpg)}
.nav_05.sel{background-image:url(../images/letter/nav_05_on.jpg)}
.nav_06.sel{background-image:url(../images/letter/nav_06_on.jpg)}



@media screen and (max-width: 750px) {
body{ width:100%; overflow-x:hidden;}
.sp_none{ display:none;}

#wrap{ margin: 0; width:100%; }
.left_mob{ float:none; width:100%; padding:0 0% 0 0%; position:relative; }
.right_mob{ float:none; width:100%; position:relative; padding:0; margin:0; }


.sp_pos{ width:200px; display:none;}
.line_f01,.line_f02{ display:none;}

.menu{ padding-bottom:16%;}
.ban_lin{ margin-top:15%;}
.last_ban{ padding-bottom:2.5; margin-bottom:10%;}
.tit_name {display:none;}



.sp_menu{ display:block; text-align:center; position:relative; padding:20px;}

/*sp left menu banner*/
.nav { position: absolute; top:8px; left:10px;width: auto;display:inline-block; border: none; }
.btn-nav {background: transparent;border: none;padding:10px;cursor:pointer;z-index: 999;}

.btn-nav:focus {outline:0;}
.icon-bar {display: block;margin:8px 0;width: 35px;height:4px;background:#666; 
  -webkit-transition: all .7s ease;
  -moz-transition: all .7s ease;
  -ms-transition: all .7s ease;
  -o-transition: all .7s ease;
  transition: all .7s ease;
  z-index: 999;
}
.middle {margin: 0 auto;}
.animated { display: block;margin: 0 auto;}
.animated:focus {cursor: pointer;z-index: 99;}
.animated .icon-bar{z-index: 999; }

.animated .top {
  -webkit-transform: translateY(12px) rotateZ(45deg);
  -moz-transform: translateY(12px) rotateZ(45deg);
  -ms-transform: translateY(12px) rotateZ(45deg);
  -o-transform: translateY(12px) rotateZ(45deg);
  transform: translateY(12px) rotateZ(45deg);
}
.animated .bottom {
  -webkit-transform: translateY(-12px) rotateZ(-45deg);
  -moz-transform: translateY(-12px) rotateZ(-45deg);
  -ms-transform: translateY(-12px) rotateZ(-45deg);
  -o-transform: translateY(-12px) rotateZ(-45deg);
  transform: translateY(-12px) rotateZ(-45deg);
}
.animated .middle {width: 0;}
/*sp left menu banner*/
.sp_titname{ height:40px}






.inner_l{ float:none; width:auto; padding:0 2.82% 0  4.28%; font-size:11px; line-height:24px;}
.inner_r{float:none; width:auto; padding:0 2.82% 0  4.28%; }



}

@media screen and (max-width: 400px) {
.sp_titname{ height:33px; padding-top:3px}
/*.nav{ transform:scale(0.9,0.9); top:8px;}*/



}