/* --------------------
01.共通
02.ヘッダー
03.フッターお問い合わせ
04.フッター
05.下層
--------------------*/

/* --------------------
01.共通
--------------------*/
@font-face {
font-family: 'hiraginogo_w3';
src:url('../font/hiraginogo_w3.woff2') format('woff2'),
url('../font/hiraginogo_w3.woff') format('woff'),
url('../font/hiraginogo_w3.otf')  format('opentype'); /* ttf - Safari, Android, iOS */
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'hiraginogo_w6';
src:url('../font/hiraginogo_w6.woff2') format('woff2'),
url('../font/hiraginogo_w6.woff') format('woff'),
url('../font/hiraginogo_w6.otf')  format('opentype'); /* ttf - Safari, Android, iOS */
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'Didot';
src:url('../font/Didot.woff2') format('woff2'),
url('../font/Didot.woff') format('woff'),
url('../font/Didot.ttf')  format('truetype'); /* ttf - Safari, Android, iOS */
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'A-OTF-RyuminPro-Regular';
src:url('../font/A-OTF-RyuminPro-Regular.woff2') format('woff2'),
url('../font/A-OTF-RyuminPro-Regular.woff') format('woff'),
url('../font/A-OTF-RyuminPro-Regular.otf')  format('opentype'); /* ttf - Safari, Android, iOS */
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'nskhakushuumouhitugyosou';
src:url('../font/nskhakushuumouhitugyosou.woff2') format('woff2'),
url('../font/nskhakushuumouhitugyosou.woff') format('woff'),
url('../font/nskhakushuumouhitugyosou.otf')  format('opentype'); /* ttf - Safari, Android, iOS */
font-weight: normal;
font-style: normal;
}




body{
-webkit-font-smoothing: antialiased;
}

#wrapper{
width: 100%;
overflow: hidden;
color: #000;
font-family: 'hiraginogo_w3';
font-size: 14px;
position: relative;
background: url(../img/bg.png) repeat-y center top;
}

.contents_in{
max-width: 1160px;
margin: 0 auto;
}

.pc{
display: block;
}

.sp{
display: none;
}





/* --------------------
02.ヘッダー
--------------------*/

header{
padding: 54px 0 46px;
}

header h1{
max-width: 60px;
width: 100%;
float: left;
}

header h1 img{
width: 100%;
display: block;
}

header nav{
display: flex;
justify-content: space-between;
align-items: center;
max-width: 1060px;
width: 91.38%;
float: right;
}

header .nav_in{
font-size: 0;
}

header .nav_in li{
display: inline-block;
font-family: 'Didot';
font-size: 16px;
position: relative;
}

header .nav_in li::before{
width: 1px;
height: 16px;
background: #2C2B2B;
box-sizing: border-box;
content: "";
display: inline-block;
vertical-align: top;
}

header .nav_in li:last-child::after{
width: 1px;
height: 16px;
background: #2C2B2B;
box-sizing: border-box;
content: "";
display: inline-block;
vertical-align: top;
}

header .nav_in li a{
color: #2C2B2B;
display: inline-block;
padding: 0 12px;
box-sizing: border-box;
}

header .sub_nav_g{
font-size: 0;
max-width: 278px;
width: 26.23%;
}

header .sub_nav_g li{
max-width: 120px;
width: 43.16%;
background: #000;
box-sizing: border-box;
text-align: center;
display: inline-block;
margin: 0 0 0 6.84%;
font-family: 'Didot';
font-size: 16px;
letter-spacing: 0.02em;
transition: all .3s;
}

header .sub_nav_g li a{
color: #fff;
display: inline-block;
width: 100%;
padding: 22px 0 21px;
}

header .sub_nav_g li:hover{
box-shadow: 4px 4px 4px #666;
}


/* --------------------
03.フッターお問い合わせ
--------------------*/

#contact_footer{
background: url(../img/bg_contact.jpg) no-repeat center center;
background-size: cover;
padding: 37px 0 91px;
position: relative;
margin: 30px auto 0;
}

#contact_footer::before{
content: "";
display: block;
width: 1px;
height: 57px;
background: #000;
box-sizing: border-box;
margin: 0 auto;
position: absolute;
top: -30px;
left: 50%;
}

#contact_footer h2{
font-family: 'Didot';
font-size: 32px;
text-align: center;
padding: 0 0 49px;
}

#contact_footer .cnt_g{
max-width: 1036px;
margin: 0 auto;
}

#contact_footer .cnt_box{
max-width: 450px;
width: 43.44%;
float: left;
margin: 0 3.28%;
}

#contact_footer .cnt_box h3{
font-family: 'hiraginogo_w6';
font-size: 16px;
line-height: 27px;
margin: 0 0 14px;
}

#contact_footer .tel_box .tel_number{
padding: 0 0 14px;
max-width: 448px;
}

#contact_footer .tel_box .tel_number img{
width: 100%;
height: auto;
display: block;
}

#contact_footer .tel_box .time{
padding: 0 0 14px;
font-size: 16px;
line-height: 27px;
}

#contact_footer .web_box .next_btn{
max-width: 403px;
width: 100%;
box-sizing: border-box;
background: #000;
border: 1px solid #000;
margin: 0 0 22px;
transition: all .3s;
}

#contact_footer .web_box .next_btn a{
width: 100%;
display: inline-block;
padding: 27px 0 26px;
color: #fff;
text-align: center;
font-size: 18px;
font-family: 'hiraginogo_w6';
position: relative;
}

#contact_footer .web_box .next_btn a::after{
content: "";
display: block;
background: url(../img/arrow_right02.svg) no-repeat right center;
width: 5px;
height: 8px;
background-size: 5px auto;
position: absolute;
top: 46%;
right: 5%;
}

#contact_footer .web_box .next_btn:hover{
box-shadow: 4px 4px 4px #666;
}



/* --------------------
04.フッター
--------------------*/

#footer_top{
background: #333;
padding: 78px 0 58px;
}

#footer_top ul{
font-size: 0;
text-align: center;
}

#footer_top li{
font-family: 'Didot';
font-size: 16px;
line-height: 20px;
display: inline-block;
color: #fff;
}

#footer_top li::before{
width: 1px;
height: 16px;
background: #fff;
box-sizing: border-box;
content: "";
display: inline-block;
vertical-align: -3px;
}

#footer_top li:last-child::after{
width: 1px;
height: 16px;
background: #fff;
box-sizing: border-box;
content: "";
display: inline-block;
vertical-align: -3px;
}

#footer_top li a{
color: #fff;
display: inline-block;
box-sizing: border-box;
padding: 0 12px;
}

#footer_bottom{
background: #000;
padding: 33px 0 26px;
text-align: center;
}

#footer_bottom small{
display: block;
text-align: center;
color: #fff;
font-family: 'hiraginogo_w6';
font-size: 11px;
}





/* --------------------
05.下層
--------------------*/

.under_page{
opacity: 0;
transition: all .3s;
}

.under_page #title_area{
max-width: 1280px;
margin: 0 auto 28px;
position: relative;
}

.under_page #title_area .h1_g{
background: #000;
max-width: 320px;
width: 25%;
/* height: 320px; */
color: #fff;
box-sizing: border-box;
position: absolute;
top: 0px;
left: 0;
opacity: 0;
/* transition: all .3s; */
overflow: hidden;
}

.under_page #title_area .h1_g::before{
content: "";
display: block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: #000;
z-index: 2;
transition: all 1s;
}

.under_page #title_area .h1_g.active::before{
left: 100%;
}

.under_page #title_area .h1_g h1{
font-family: 'Didot';
color: #fff;
font-size: 32px;
text-align: center;
display: block;
width: 100%;
}

.under_page #title_area .h1_g h1 span{
display: block;
font-size: 14px;
padding: 17px 0 0;
}

.under_page #title_area .mainimg {
max-width: 1160px;
width: 91%;
margin: 0 auto;
}

.under_page #title_area .mainimg img{
width: 100%;
height: auto;
display: block;
}

.under_page #content{
max-width: 1280px;
position: relative;
}

.under_page #content .scroll{
position: absolute;
top: 0;
left: 1.6%;
font-family: 'Didot';
font-size: 16px;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
width: 16px;
}

.under_page #content .scroll span{
display: inline-block;
position: relative;
width: 16px;
}

.under_page #content .scroll span::after{
content: "";
display: block;
position: absolute;
top: 59px;
left: 46%;
width: 1px;
height: 100px;
background: #000;
}

.under_page #content #global{
max-width: 1160px;
width: 91%;
margin: 0 auto;
}


.under_page .pager_g{
text-align: center;
font-size: 0;
}

.under_page .pager_g a,.under_page .pager_g span{
font-size: 18px;
max-width: 40px;
width: 100%;
display: inline-block;
padding: 11px 0;
box-sizing: border-box;
border: 1px solid #707070;
background: #fff;
margin: 0 10px;
text-align: center;
}

.under_page .pager_g span{
background: #000000;
color: #fff;
}

.under_page .pager_g a.nextpostslink,.under_page .pager_g a.previouspostslink{
border:none;
background: url(../img/arrow_right01.png) no-repeat right top;
width: 9px;
padding: 0;
text-indent: -9999px;
vertical-align: -3px;
color: rgba(0,0,0,0);
}

.under_page .pager_g a.previouspostslink{
background: url(../img/arrow_left01.png) no-repeat right top;
}




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

/* --------------------
01.共通
--------------------*/

#wrapper{
background-size: contain;
}

.contents_in{
width: 94%;
}



/* --------------------
02.ヘッダー
--------------------*/

header{
padding: 27px 0 23px;
}

header.active{
background: #2C2B2B;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
z-index: 10;
overflow: hidden;
}

header.active h1{
opacity: 0;
}

.nav_btn{
width:28px;
cursor:pointer;
position:relative;
transition: all .4s;
box-sizing: border-box;
height:22px;
margin: 18px 0 0 auto;
float: right;
}

.nav_btn .nav_line{
width:28px;
border-top:2px solid #000;
display: inline-block;
transition: all .4s;
box-sizing: border-box;
position: absolute;
left:0;
right:0;
margin:0 auto;
}

header.active .nav_line{
border-color: #fff;
}

.nav_btn .nav_line01{
top:0px;
}

.nav_btn .nav_line02{
/* top:10px; */
position: relative;
}

.nav_btn .nav_line02::after{
content: "";
display: block;
width: 30px;
height: 30px;
border-radius: 100%;
left: 50%;
top: 50%;
margin-left: -16px;
margin-top: -18px;
position: absolute;
}

.nav_btn .nav_line03{
top:20px;
}

.nav_btn.active .nav_line01{
-webkit-transform: translateY(10px) rotate(-45deg);
transform: translateY(10px) rotate(-45deg);
}

.nav_btn .nav_line02.hover_line{
-webkit-transform: translateX(10px) rotate(0deg);
transform: translateX(10px) rotate(0deg);
}

.nav_btn.active .nav_line02{
/* top:12px; */
/* left: 50%; */
opacity: 0;
-webkit-animation: active-menu-bar02 .8s forwards;
animation: active-menu-bar02 .8s forwards;
}

.nav_btn.active .nav_line02::after{
content: "";
animation: type9-circle .5s;
animation-fill-mode: forwards;
}

.nav_btn.active .nav_line03{
-webkit-transform: translateY(-10px) rotate(45deg);
transform: translateY(-10px) rotate(45deg);
}

@keyframes type9-circle{
  0%{
    transform:scale(0);
    opacity: 1;
    border: 1px solid #fff;
  }
  100%{
    opacity: 0;
    border: 1px solid #fff;
    transform:scale(4.5);
  }
}

header nav{
display: none;
max-width: none;
float: none;
width: auto;
clear: both;
}

header .nav_in li{
display: block;
font-size: 24px;
text-align: center;
margin: 0 0 30px;
}

header .nav_in li a{
color: #fff;
}

header .nav_in li::before{
content: none;
}

header .nav_in li:last-child::after{
content: none;
}

header.active nav{
display: block;
}

header .sub_nav_g{
width: 100%;
margin: 20px auto 0;
}

header .sub_nav_g li{
margin: 0 9px;
width: 100%;
font-weight: bold;
}





/* --------------------
03.フッターお問い合わせ
--------------------*/

#contact_footer .cnt_box{
width: 47.44%;
margin: 0 1.28%;
}

#contact_footer .tel_box .tel_number{
width: 92%;
}

/* --------------------
04.フッター
--------------------*/

#footer_top{
padding: 78px 0 48px;
}

#footer_top ul{
max-width: 380px;
margin: 0 auto;
}

#footer_top li{
margin: 0 0 10px;
}

#footer_top li:nth-child(4)::after{
width: 1px;
height: 16px;
background: #fff;
box-sizing: border-box;
content: "";
display: inline-block;
vertical-align: -3px;
}

/* --------------------
05.下層
--------------------*/

.under_page #content{
width: auto;
}


}

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

/* --------------------
01.共通
--------------------*/
.pc{
display: none;
}

.sp{
display: block;
}




/* --------------------
02.ヘッダー
--------------------*/

/* --------------------
03.フッターお問い合わせ
--------------------*/

#contact_footer{
padding: 37px 0 50px;
}

#contact_footer h2{
font-size: 28px;
}

#contact_footer .cnt_box{
float: none;
max-width: none;
width: 96%;
margin: 0 auto;
text-align: center;
}

#contact_footer .cnt_box h3{
margin: 0 0 5px;
}

#contact_footer .tel_box{
padding: 0 0 11px;
}

#contact_footer .tel_box .tel_number{
/* font-size: 40px;
height: 21px;
padding: 9px 0 5px; */
padding: 0 0 5px;
width: 60%;
margin: 0 auto;
}

#contact_footer .web_box .next_btn{
width: 94%;
margin: 0 auto 20px;
}

#contact_footer .web_box .next_btn a{
font-size: 15px;
padding: 22px 0 21px;
}

/* --------------------
04.フッター
--------------------*/

#footer_top{
padding: 38px 0 28px;
}

#footer_top ul{
max-width: 260px;
}

#footer_top li:nth-child(4)::after{
content: none;
}

#footer_top li:nth-child(3)::after{
width: 1px;
height: 16px;
background: #fff;
box-sizing: border-box;
content: "";
display: inline-block;
vertical-align: -3px;
}

#footer_top li:nth-child(5)::after{
width: 1px;
height: 16px;
background: #fff;
box-sizing: border-box;
content: "";
display: inline-block;
vertical-align: -3px;
}

#footer_bottom{
padding: 21px 0;
}

#footer_bottom small{
line-height: 16px;
}



/* --------------------
05.下層
--------------------*/

.under_page #title_area .h1_g h1{
font-size: 24px;
}

.under_page #title_area .h1_g h1 span{
font-size: 12px;
line-height: 18px;
}

.under_page #title_area .mainimg {
margin: 0 0 0 auto;
}

.under_page #title_area .mainimg img{
display: none;
}

.under_page #title_area .mainimg{
height: 34vh;
}

.under_page #title_area .h1_g{
width: 45%;
}

.under_page #content #global{
width: 86%;
}

.under_page #content .scroll{
/* left: 0.6%; */
font-size: 14px;
width: 14px;
bottom: 52px;
}

.under_page #content .scroll span{
width: 14px;
}

.under_page #content .scroll span::after{
height: 60px;
}




}