@charset "utf-8";
@import "font-awesome.css";
@import "yakuhanjp.min.css";

/* ----------------------------------------

- RESET BROWSER EFFECT

---------------------------------------- */

abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;line-height:1}article,main,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,th,var{font-style:normal;}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;}q:after,q:before{content:''}abbr,acronym{border:0}img{vertical-align:top}

/* ----------------------------------------

- MODULE

---------------------------------------- */

/* CLEAR
----------------------------------------------------- */
.clear{clear:both!important;}

/* CLEAR FIX
----------------------------------------------------- */
*:first-child+html .clearfix{display:inline-block;} /* for IE7 */
.clearfix:after {content:" ";
    display:block;
    visibility:hidden;
    clear:both;
    height:0.1px;
    font-size:0.1em;
    line-height:0;}
* html .clearfix {display:inline-block;}
/* no ie mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block; clear:both;}
/* */

/* ----------------------------------------

- FORMAT

---------------------------------------- */

html{font-size:13px; background-color:#fff;}
body{color:#232323; font-family: YakuHanJP,'Noto Sans Japanese',sans-serif; -webkit-text-size-adjust:100%; font-weight:400; position:relative; width:100%;}

a{text-decoration:none; outline:none; color:#333;}
a img{box-shadow:#000 0 0 0;}

#wrapper{background-color:#fff; width:1200px; margin:0 auto;}

/* header
----------------------------------------------------- */
#wrapper > header{position:relative; z-index:2;}
#wrapper > header h1{position:relative; z-index:1; padding-bottom:91px;}
#wrapper > header nav{position:absolute; z-index:2; background:url(../images/gnav_bg.gif) repeat-x; height:91px; top:154px; width:1200px;}
#wrapper > header nav.fixed{position:fixed; top:0;}
#wrapper > header nav ul{text-align:center; font-size:0px;}
#wrapper > header nav ul li{display:inline-block;}


/* main
----------------------------------------------------- */
main{position:relative; z-index:1;}
main #mv{margin-bottom:75px;}
main .secWrapper h2{text-align:center;}

/* mv
----------------------------------------------------- */

 /*=== 画像の表示エリア ================================= */
.slide {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 1200px;
  height     : 786px;
  margin     : auto;      /* サンプルは中央寄せの背景：白 */
  background : #fff;
}
 
 /*=== 画像の設定 ======================================= */
.slide img {
  display    : block;
  position   : absolute;
                      /* 画像のサイズを表示エリアに合せる */
  width      : inherit;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 16s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slide img:nth-of-type(1) { animation-delay: 0s }
.slide img:nth-of-type(2) { animation-delay: 4s }
.slide img:nth-of-type(3) { animation-delay: 8s }
.slide img:nth-of-type(4) { animation-delay: 12s }
 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnime{
   0% { opacity: 0 }
   2% { opacity: 1 }
  23% { opacity: 1 }
  25% { opacity: 0 }
 100% { opacity: 0 }
}



/* service
----------------------------------------------------- */
#service{margin-bottom:75px;}
#service h2{margin-bottom:40px;}
#service h3{font-weight:700; font-size:30px; text-align:center; color:#0056a7; margin-bottom:35px;}
#serviceInner{width:821px; margin:0 auto;}
#serviceInner section{width:380px; height:212px; box-sizing:border-box; border:4px solid #ffcb00; border-top:none; position:relative; background-position:left bottom; background-repeat:no-repeat; position:relative; z-index:1;}
#serviceInner section h4{height:39px; line-height:37px; font-size:21px; text-align:center; font-weight:700; background-color:#ffcb00;}
#serviceInner section ul{padding-left:175px; position:absolute; left:0; top:50%; webkit-transform:translate(0%, -50%); transform:translate(0%, -50%); margin-top:20px;}
#serviceInner section ul li{font-size:14px; line-height:1.8; text-indent:-1.2em;}
#serviceInner section ul li:before{content:"●"; color:#0056a7; margin-right:3px;}
#serviceInner section.list01{background-image:url(../images/service_icon01.png); margin-bottom:40px; float:left;}
#serviceInner section.list02{background-image:url(../images/service_icon02.png); margin-bottom:40px; float:right;}
#serviceInner section.list03{background-image:url(../images/service_icon03.png); margin-bottom:40px; float:left;}
#serviceInner section.list04{background-image:url(../images/service_icon04.png); margin-bottom:40px; float:right;}
#serviceInner section.list05{background-image:url(../images/service_icon05.png); float:left;}

#serviceBottomWrapper{width:821px; margin:0 auto; position:relative; margin-top:-165px; z-index:2;}
#serviceBottomWrapper #serviceBottom{width:951px; height:293px; background:url(../images/service_bottom.png); position:relative;}
#serviceBottomWrapper #serviceBottom p{position:absolute; top:230px; left:70px; font-size:18px; font-weight:700;}

/* news
----------------------------------------------------- */
#news{margin-bottom:75px;}
#news h2{margin-bottom:16px;}
#newsInner{width:822px; margin:0 auto;}
#newsInner #blogFeed li{padding-bottom:9px; margin-bottom:8px; border-bottom:1px dashed #b3b3b4;}
#newsInner #blogFeed li:last-of-type{padding-bottom:0; margin-bottom:0; border:none;}
#newsInner #blogFeed li a{display:block; height:70px; background-color:#edf6f7; padding-left:60px; font-size:17px; position:relative;}
#newsInner #blogFeed li a:before{display:block; content:url(../images/icon_link01.png); display:block; position:absolute; left:17px; top:50%; margin-top:-15px}
	#newsInner #blogFeed li a:hover{opacity:0.5;}
#newsInner #blogFeed li:nth-child(even) a:before{opacity:0.5;}
#newsInner #blogFeed li a time{display:inline-block; line-height:70px; width:110px; vertical-align:top;}
#newsInner #blogFeed li a h3{display:inline-block; line-height:70px; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; width:615px; vertical-align:top; font-weight:500;}

/* promise
----------------------------------------------------- */
#promise{margin-bottom:75px;}
#promise h2{margin-bottom:40px;}
#promise h3{font-weight:700; font-size:30px; text-align:center; margin-bottom:35px;}
#promise #promiseList{margin-bottom:50px;}
#promise #promiseList ul{text-align:center;}
#promise #promiseList ul li{display:inline-block; padding:0 5px;}
#promise #promiseList ul li figure{margin-bottom:10px;}
#promise #promiseList ul li p{font-size:16px; line-height:1.45; font-weight:500; margin-left:15px;}
#promise #promiseImg{text-align:center;}

/* price
----------------------------------------------------- */
#price{margin-bottom:140px;}
#price h2{margin-bottom:40px;}
#price .note {font-weight: 500; font-size: 18px; text-align: center; margin-bottom: 50px;}
#priceList{width:820px; margin:0 auto;}
#priceList section{margin-bottom:30px;}
#priceList section h3{background:#ffcb00; height:54px; line-height:54px; padding-left:20px; font-size:22px; font-weight:700; position:relative; cursor:pointer;}
#priceList section h3:before{content:""; display:block; width:34px; height:34px; background:#0056a7; position:absolute; border-radius:50%; right:11px; top:50%; -webkit-transform:translate(0%, -50%); transform:translate(0%, -50%)}
#priceList section h3:after{content:"\f107"; font-family:FontAwesome; position:absolute; right:20px; top:50%; -webkit-transform:translate(0%, -50%); transform:translate(0%, -50%); color:#fff; font-size:20px;}
#priceList section.active h3:after{content:"\f106"; top:45%;}
#priceList .inner{border:5px solid #ffcb00; border-top:0; padding:20px; display:none;}
#priceList table{width:100%; border:1px solid #3378b9;}
#priceList table th,
#priceList table td {border:1px solid #3378b9; padding:10px; line-height:1.5;}
#priceList table th {background:#3378b9; color:#fff; text-align:center; padding:5px 10px;}
#priceList table tr th:nth-child(1),
#priceList table tr th:nth-child(2){border-right:1px solid #fff;}
#priceList table tr td:nth-child(2){color:#ff0000;}
#priceList table tr:nth-child(odd) > td{background:#edf6f7;}
#priceCard{text-align:center; margin-bottom:50px;}

/* shop
----------------------------------------------------- */
#shop{padding-bottom:255px; background:url(../images/shop_bg.png) no-repeat center bottom;}
#shop h2{position:relative; z-index:2; text-align:center; margin-bottom:-173px;}
#shop #shopMap{position:relative; z-index:1; margin-bottom:30px; position:relative;}
#shop #shopMap img{/*display:block; position:relative; z-index:1;*/}
#shop #shopMap #shopMapList{position:relative; z-index:2;}
#shop #shopMap #shopMapList li{position:absolute; opacity:0; -webkit-transform:translateY(0px) scale(0); transform:translateY(0px) scale(0); transition:all 200ms 0s ease-out;}
#shop #shopMap #shopMapList li.active{opacity:1; -webkit-transform:translateY(-70px) scale(1); transform:translateY(-70px) scale(1);}

#shop #shopMap #shopMapList li.shop01{left:838px; top:505px;}
#shop #shopMap #shopMapList li.shop02{left:803px; top:475px;}
#shop #shopMap #shopMapList li.shop03{left:690px; top:456px;}
#shop #shopMap #shopMapList li.shop04{left:660px; top:423px;}
#shop #shopMap #shopMapList li.shop05{left:594px; top:365px;}
#shop #shopMap #shopMapList li.shop06{left:564px; top:335px;}
#shop #shopMap #shopMapList li.shop07{left:623px; top:484px;}
#shop #shopMap #shopMapList li.shop08{left:583px; top:458px;}
#shop #shopMap #shopMapList li.shop09{left:566px; top:518px;}
#shop #shopMap #shopMapList li.shop10{left:498px; top:463px;}
#shop #shopMap #shopMapList li.shop11{left:515px; top:516px;}
#shop #shopMap #shopMapList li.shop12{left:366px; top:276px;}
#shop #shopMap #shopMapList li.shop13{left:258px; top:387px;}
#shop #shopMap #shopMapList li.shop14{left:434px; top:225px;}
#shop #shopMap #shopMapList li.shop15{left:476px; top:245px;}
#shop #shopMap #shopMapList li.shop16{left:625px; top:390px;}
#shop #shopMap #shopMapList li.shop17{left:520px; top:325px;}

#shop #shopMap #shopMapList li div{width:260px; height:70px; border-radius:8px; background-color:#f8b500; border-radius:8px; text-align:center; color:#fff; font-size:20px; font-weight:700;}
#shop #shopMap #shopMapList li div span{width:100%; height:100%; position:relative; display:block; line-height:70px;}
#shop #shopMap #shopMapList li div span:after{display:inline-block; content:""; border-style: solid; position:absolute; border-width:16px 13px 0 13px; border-color:#f8b600 transparent transparent; left:50%; bottom:-15px; margin-left:-13px;}

#shop #shopList{width:942px; margin:0 auto;}
#shop #shopList section{margin-bottom:20px;}
#shop #shopList section:nth-child(odd){float:left;}
#shop #shopList section:nth-child(even){float:right;}
#shop #shopList section .inner{background-color:#0056a5; padding:10px 15px; /*height:265px;*/ position:relative;}
#shop #shopList section .inner .figBox{margin-bottom:10px;}
#shop #shopList section .inner .figBox .map{float:left;}
#shop #shopList section .inner .figBox figure{float:right;}
#shop #shopList section .inner address{font-size:13px; line-height:1.4; color:#fff;}
#shop #shopList section .inner address span{display:block; font-size:45px; font-weight:900;}
#shop #shopList section .inner a.btn{display:block; position:absolute; right:10px; bottom:10px;}
#shop #shopList section .inner a.btn:hover{opacity:0.5;}

/* company
----------------------------------------------------- */
#company{margin-bottom:75px;}
#company h2{margin-bottom:25px;}
#greeting{width:815px; margin:0 auto 30px; background: url(../images/company_greeting02.png) no-repeat right bottom;}
#greeting h3{position:relative; z-index:2; font-weight:700; color:#0056a7; font-size:30px; letter-spacing:0.1em; text-align:center; margin-bottom:-10px;}
#greeting .inner h4{margin-bottom:7px;}
#greeting .inner p{font-size:14px; line-height:1.9; margin-bottom:10px;}
#greeting .inner ol{margin-bottom:10px;}
#greeting .inner ol li{font-size:15px; line-height:1.9; font-weight:bold;}
#greeting .inner div{font-size:15px; font-weight:bold; margin-left:260px;}
#greeting .inner span{color:#ff0000; font-size:14px;}
#outline{background:url(../images/company_outline_bg.gif) no-repeat center bottom #b9e0ef; padding:50px 330px 290px;}
#outline section{border:2px solid #80aad3; border-radius:8px; background-color:#fff; margin-bottom:20px;}
#outline section:last-of-type{margin-bottom:0;}
#outline section h3{border-bottom:1px solid #80aad3; height:50px; line-height:50px; text-align:center; font-weight:700; font-size:18px; color:#0056a7;}
#outline section .secInner{padding:20px 40px;}
#outline section .secInner p,
#outline section .secInner li,
#outline section .secInner th,
#outline section .secInner td{line-height:2;}
#outline section .secInner p{text-align:center;}
#outline section .secInner td,
#outline section .secInner th{border-bottom:1px solid #cacaca; padding:7px 0; vertical-align:top;}
#outline section .secInner th{width:125px; font-weight:normal; color:#979797;}
#outline section .secInner td span{display:inline-block; width:6em;}
#outline section .secInner table{width:100%;}
#outline section .secInner table tr:first-of-type th,
#outline section .secInner table tr:first-of-type td{padding-top:0;}
#outline section .secInner table tr:last-of-type th,
#outline section .secInner table tr:last-of-type td{border-bottom:none;}
#company nav{background-color:#c8d94d; padding:0 0 22px;}
#company nav ul{text-align:center;}
#company nav ul li{display:inline-block; padding:0 4px; margin-bottom:8px;}
#company nav ul li a:hover{opacity:0.5;}

/* recruit
----------------------------------------------------- */
#recruit{margin-bottom:75px;}
#recruit h2{margin-bottom:30px; text-align:center;}
#recruitInner{width:820px; margin:0 auto;}
#recruit01{padding:0 0 0 17px; margin-bottom:32px;}
#recruit01 figure{float:left;}
#recruit01 .colR{float:right;}
#recruit01 .colR p{margin-left:13px; font-size:16px; line-height:2;}
#recruit01 .colR p span{color:#ff0000;}
#recruit02{margin-bottom:32px;}
#recruit02 ul{text-align:center;}
#recruit02 ul li{display:inline-block; padding:0 4px; margin-bottom: 8px;}
#recruit03{margin-bottom:35px;}
#recruit03 table{width:100%; border-top:1px solid #0056a7;}
#recruit03 table tr th,
#recruit03 table tr td{border-bottom:1px solid #0056a7; padding:15px 0; line-height:2; padding-left:20px;}
#recruit03 table tr td *{line-height:2;}
#recruit03 table tr th{width:120px; text-align:center;}
#recruit03 table tr td li{text-indent:-1em; margin-left:1em;}

/* partner
----------------------------------------------------- */
#partner{margin-bottom:75px;}
#partner h2{margin-bottom:30px; text-align:center;}
#partnerInner{width:820px; margin:0 auto;}
#partnerInner .mv{margin-bottom:40px;}


#partnerInner .tel{text-align:center;}
#partnerInner .tel .text01{font-weight:900; font-size:28px; letter-spacing:0.1em; margin-bottom:20px;}
#partnerInner .tel .text02{background-color:#ffff00; padding:10px 20px;}
#partnerInner .tel .text02 span{display:table; margin:0 auto; text-align:left; color:#ff0000; font-weight:900; font-size:36px; line-height:1.2;}


/* footer
----------------------------------------------------- */
#wrapper > footer{background-color:#0056a7; text-align:center; position:relative; z-index:1;}
#wrapper > footer h2{padding:25px 0; border-bottom:1px solid rgba(255,255,255,0.25);}
#wrapper > footer small{display:block; font-size:11px; color:#fff; height:40px; line-height:40px;}