@charset "utf-8";
html {
overflow: auto;
}
body {
min-width: 1000px;
overflow: hidden;
}

#contents{
line-height:1.7;
}

.mincho{
font-family: 'Noto Serif JP', serif;
font-weight:600;
}

.mincho02{
font-family: 'Noto Serif JP', serif;
font-weight:400;
}

/*
-----------------------------------------------
SP
----------------------------------------------- */
@media screen and (max-width: 768px) {
body {
min-width: 100%;
overflow: hidden;
}
}


/*
-----------------------------------------------
追加ナビ
----------------------------------------------- */
.head-navi{
display:block;
position:absolute;
top:24px;
right:130px;
z-index:100;
}

.head-navi li{
display:inline-block;
pointer-events: auto;
margin-left:5px;
}

.head-navi li a{
pointer-events: auto;
font-size:14px;
background:#ba473a;
color:#fff;
display:block;
padding:0.6em 1.5em;
border-radius:30px;
line-height:1.0;
text-decoration:none;
}

.head-navi li a:hover{
color:#f6db23;
}

.sp-upmenu{
margin-bottom:24px;
}

.sp-upmenu li{
display:inline-block;
margin-left:10px;
margin-right:10px;
font-size:17px;
}

.sp-upmenu li:before{
content: url(../img/mk.png);
margin-right:4px;
}


/*
-----------------------------------------------
追加ナビ TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.head-navi{
top:54px;
right:130px;
}

.sp-upmenu{
margin-top:44px;
margin-bottom:24px;
}

}


/*
-----------------------------------------------
追加ナビ SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.head-navi{
display:none;
}

.sp-upmenu{
margin-top:44px;
margin-bottom:16px;
}

.sp-upmenu li{
margin-bottom:4px;
font-size:15px;
}

}


/*
-----------------------------------------------
ナビゲーション
----------------------------------------------- */
.drawer-toggle,
.drawer-hamburger,
.drawer-menu{
pointer-events: auto !important;
}

/* ハンバーガーメニューのMENUの文字 */
.nav-menu{
position:absolute;
top:32px;
left:0px;
font-size:1.6rem;
color:#fff;
letter-spacing:1px;
}

.is-fixed .nav-menu{
color:#009fe8;
}


.sp-nav-ttl{
width:200px;
margin-bottom:30px;
}

.sp-nav-ttl dt{
font-size:16px;
line-height:1.0;
background:#fbd0d1;
padding:10px 0;
margin-bottom:4px;
}

.sp-nav{
display:inline-block;
margin-left:7px;
margin-right:7px;
}

.sp-nav:before{
content: url(../img/mk.png);
margin-right:4px;
}


.bdr01{
border:solid 2px;
}

.drawer-menu{
width:900px;
margin-left:auto;
margin-right:auto;
text-align:center;
background:#fff;
padding-top:0px;
}

.hm-container{
display:flex;
/* justify-content:space-between; */
justify-content:space-around;
flex-wrap:wrap !important;
}

.hm-box01{
}



/*
-----------------------------------------------
ナビゲーション SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.nav-menu{
display:none;
}
.hm-container{
flex-wrap:wrap !important;
}

.sp-nav-ttl{
width:145px;
margin-bottom:15px;
}

.sp-nav-ttl dt{
font-size:15px;
}
.sp-nav-ttl dt .sml{
font-size:13px;
}

.sp-nav-ttl dd{
font-size:14px;
line-height:1.0;
background:#eaf5fc;
padding:8px 0;
margin-bottom:2px;
}

.sp-nav{
font-size:12px;
display:inline-block;
margin-left:0px;
margin-right:6px;
}

.sp-nav:before{
content: url(../img/mk.png);
margin-right:2px;
}




}

/*
-----------------------------------------------
ヘッダ
----------------------------------------------- */

.drawer-open .nav-menu{
/* color:#35adf2 !important; */
color:#009fe8 !important;
}

.drawer-hamburger-icon,
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {
  background-color: #fff !important;
  } 
/* スクロールでハンバーガーボタンの色を変える */
.is-fixed .drawer-hamburger-icon,
.is-fixed .drawer-hamburger-icon:before,
.is-fixed .drawer-hamburger-icon:after {
  background-color: #009fe8 !important;
  } 

/* オープンの時の色 */
.drawer-open .drawer-hamburger-icon,
.drawer-open .drawer-hamburger-icon:before,
.drawer-open .drawer-hamburger-icon:after {
  background-color: #009fe8 !important;
}


/* 開いた時真ん中の線を消す */
.drawer-open .drawer-hamburger-icon {
background-color: rgba(255,255,255,0.0) !important; 
}


header  {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1400;
  pointer-events: none;
  width: 100%;
  /*   background:#029ccf; */
  /*   transition: 3.5s; */
  /*   background-color: rgba(255,255,255,0); */
}




/* スクロールで付加されるクラス */
.is-fixed  {
  position:  fixed;
  top: 0;
  left: 0;
  z-index: 1400;
  pointer-events: none;
  width: 100%;
  background:#fff !important;
  /*   background-color: rgba(255,255,255,0.9); */
  /*   -webkit-transition: all .2s ease 0s,background .3s ease .2s;
  transition: all .2s ease 0s,background .3s ease .2s; */
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}

.head-in{
width:1080px;
margin-left:auto;
margin-right:auto;
padding:8px 0;
}

.head-logo{
display:none;
}

.is-fixed .head-logo {
display:block;
position:relative;
z-index:100;
width:334px;
padding:5px 0 10px 20px;
}

.is-fixed .head-logo img{
width:100%;
height:auto;
pointer-events: auto;
}

.is-fixed .head-logo p{
font-size:14px;
margin-bottom:3px;
letter-spacing:1px;
}

.drawer-hamburger {
  width: 5.0rem;
  padding: 0;
  margin-top: 24px;
  margin-right: 50px;
  padding-bottom: 15px;
  padding-left: 0px;
}

.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {
  position: absolute;
  top: -18px;
}

.drawer-hamburger-icon:after {
top: 16px;
}

.drawer-open .drawer-hamburger-icon:before {
top: 0px;
}

.drawer-open .drawer-hamburger-icon:after {
top: 0px;
}

.drawer-menu-item {
  font-size: 24px;
  display: inline-block;
  /*   padding: 0.4rem .80rem; */
  padding: 8px 15px;
  margin-bottom:30px;
  text-decoration: none;
  line-height:1.4;
  color: #009fe8;
}


/*
-----------------------------------------------
ハンバーガーメニュー TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {

.drawer-menu {
text-align:center;
background:#fff;
  margin: 0;
  padding: 0;
  margin-top:50px;
  list-style: none;
    width: 100%;
    padding-left:10px;
    padding-right:10px;
    padding-top:10px;
}

.drawer-menu-item {
  font-size: 18px;
  margin-bottom:10px;
  margin-top:0px;
}



}



/*
-----------------------------------------------
ハンバーガーメニュー SP ロゴ
----------------------------------------------- */
@media screen and (max-width: 767px) {
/* .is-fixed  {
height: 70px !important;
} */

.is-fixed .head-logo p{
font-size:10px;
line-height:1.1;
margin-bottom:0;
letter-spacing:1px;
}
.head-logo,
.is-fixed .head-logo{
position:relative;
z-index:50;
width:220px;
padding:5px 0 0 15px;
}

.head-logo img{
width:100%;
height:auto;
}


.drawer-hamburger {
  width: 2.8rem;
  padding: 0;
  margin-top: 20px;
  margin-right: 20px;
  padding-bottom: 0px;
  padding-left: 0px;
}

.drawer-open .drawer-hamburger{
  margin-top:10px;
  padding: 5px 5px 15px 5px;
background-color: rgba(255,255,255,0.9) !important; 
border:solid 1px #35adf2;
}


.drawer-hamburger-icon:before{
top: -12px;
}

.drawer-hamburger-icon:after{
top: 12px;
}


.drawer-menu {
text-align:center;
background:#fff;
  margin: 0;
  padding: 0;
  margin-top:0px;
  list-style: none;
    width: 100%;
    padding-left:10px;
    padding-right:10px;
    padding-top:10px;
}

.drawer-menu-item {
  font-size: 17px;
  margin-bottom:10px;
  margin-top:0px;
}


}


/*
-----------------------------------------------
コンテンツ幅
----------------------------------------------- */
.in-box01,
.foot-box01{
position:relative;
width:1080px;
margin-left:auto;
margin-right:auto;
}

.in-box02{
position:relative;
width:900px;
margin-left:auto;
margin-right:auto;
}


.in-box04{
position:relative;
width:650px;
margin-left:auto;
margin-right:auto;
}

.in-box05{
position:relative;
width:570px;
margin-left:auto;
margin-right:auto;
}

.in-box06{
position:relative;
width:770px;
margin-left:auto;
margin-right:auto;
}


/*
-----------------------------------------------
TAB 横 コンテンツ幅
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
.in-box01,
.foot-box01{
width:100%;
padding-left:24px;
padding-right:24px;
}

.sp-tabonly{
display:none;
}

}

/*
-----------------------------------------------
コンテンツ幅 TAB SP
----------------------------------------------- */
@media screen and (max-width: 768px) {
.in-box01,
.in-box02,
.in-box03,
.in-box04,
.in-box05,
.in-box06{
width:100%;
padding-left:15px;
padding-right:15px;
}



}


/*
-----------------------------------------------
パンクズ
----------------------------------------------- */

.pk{
width:1080px;
padding-top:18px;
margin-left:auto;
margin-right:auto;
margin-bottom:60px;
}

.pk-ul li{
line-height:1.3 !important;
display:inline;
font-size:13px;
}

.pk-ul li a{
color:#333 !important;
}

.pk-ul li a:hover{
text-decoration:underline !important;
}

/*
-----------------------------------------------
TAB 横 PK
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
.pk{
width:100%;
padding-left:14px;
padding-right:14px;
}
}

/*
-----------------------------------------------
パンクズ SP
----------------------------------------------- */
@media screen and (max-width: 768px) {
.pk{
width:100%;
padding-left:14px;
padding-right:14px;
margin-bottom:35px;
padding-top:10px;
padding-bottom:0px;
font-size:1.2rem !important;
}
}

/*
-----------------------------------------------
ボタン
----------------------------------------------- */
.btn01,
.btn02,
.btn03{
display:inline-block;
z-index:30;
}

.is-fixed .btn02{
pointer-events: auto;
}


.btn01 a{
font-size:20px;
color:#fff;
display:block;
padding:1.2em 0;
width:284px;
border-radius:8px;
border:solid 2px #fff;
line-height:1.0;
text-decoration:none;
}

.btn01 a:hover{
text-decoration:none;
background-color:rgba(255,255,255,.2);
}


.btn02 a{
pointer-events: auto;
z-index:30;
font-size:24px;
background:#ba473a;
color:#fff;
display:block;
padding:0.8em 3em;
border-radius:40px;
border:solid 7px #fff;
line-height:1.0;
text-decoration:none;
}

.btn03 a{
pointer-events: auto;
z-index:30;
font-size:18px;
background:#ba473a;
color:#fff;
display:block;
padding:0.8em 2em;
border-radius:30px;
line-height:1.0;
text-decoration:none;
}


.btn02 a:hover,
.btn03 a:hover{
background:#c66660;
}

/*
-----------------------------------------------
ボタン SP
----------------------------------------------- */
@media screen and (max-width: 767px) {

.btn02 a{
pointer-events: auto;
z-index:30;
font-size:20px;
background:#ba473a;
color:#fff;
display:block;
padding:0.8em 2em;
border-radius:40px;
border:solid 7px #fff;
line-height:1.0;
text-decoration:none;
}

}





/*
-----------------------------------------------
ページ
----------------------------------------------- */
.page-head{
margin-top:100px;
height:250px;
display: table;
width: 100%;
background:url(../img/head_bg.png);
background-position:top center;
}

.page-head-top{
height:648px;
display: table;
width: 100%;
}


.inner-ttl{
display: table-cell;
vertical-align: middle;
text-align:center;
color:#6a3907;
font-weight:bold;
font-size:44px;
letter-spacing:8px;
line-height:1.0;
}

/*
-----------------------------------------------
TAB 横
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
.box-type01{
position:relative;
width:48%;
}


}


/*
-----------------------------------------------
ページ SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.page-head{
margin-top:60px;
height:100px;
}

.page-head-top{
height:455px;
}

.inner-ttl{
font-size:22px;
}

}


/*
-----------------------------------------------
flex
----------------------------------------------- */
.container01{
display:flex;
flex-wrap:wrap;
}

.container02{
display:flex;
flex-wrap:nowrap;
}

.c-type01{
justify-content:space-between;
}

.c-type02{
justify-content:space-around;
}

.c-type03{
justify-content:flex-start;
}

.c-type04{
justify-content:center;
}









/*
-----------------------------------------------
フェードイン
----------------------------------------------- */
 .fadein {
  opacity: 0;
  transform : translate(0, 100px);
  transition : all 1000ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}


/*
-----------------------------------------------
フェードイン SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 600ms;
}

}


/*
-----------------------------------------------
TOPレイアウト
----------------------------------------------- */
.top-main{
position:relative;
background-image:url(../img/main_bg.jpg);
background-position:top center;
background-repeat:no-repeat;
background-size:100%;
display: table;
width: 100%;
}

.top-main-logo{
position: relative;
text-align:center;
padding-top:15%;
padding-bottom:18%;

}


.top-main-logo img{
width:459px;
height:auto;
text-align:center;
margin-left:auto;
margin-right:auto;
}


.top-main-in{
width:1080px;
position:relative;
margin-left:auto;
margin-right:auto;
}

.shotoku{
position:absolute;
top:15px;
left:15px;
}

.shotoku img{
width:169px;
height:auto;
}

.top-lead{
font-size:18px;
letter-spacing:1px;
line-height:1.9;
padding-bottom:60px;
}

.top-box01{
width:54.6%;
background-image:url(../img/dotte.png);
background-repeat:no-repeat;
background-position:bottom left;
margin-left:-70px;
padding-left:100px;
padding-right:30px;
padding-bottom:20px;
}

.top-box01 p{
line-height:1.4;
margin-top:10px;
}

.top-box01 p span{
display:inline-block;
padding:0.4em 1em;
background:#f1f0f0;
}
.top-box02{
width:44.5%;
}

.bg01{
background:#e0f2fc;
}

.top-box03{
width:359px;
}

.top-box03 h2{
padding-top:80px;
}

.top-box04{
width:580px;
}

.top-wrap1{
padding:40px 0 0px 0;
}

.top-box04 h3{
font-size:26px;
margin-bottom:20px;
}

.vol{
display:inline-block;
padding:0.3em 0.8em;
background:#fff;
font-weight:bold;
font-size:18px;
}

.btn1{
display:inline-block;
margin-top:20px;
width:177px;
height:100%;
}

.p-top60{
padding-top:60px;
}


/*
-----------------------------------------------
TOP TAB 横 
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){



}


/*
-----------------------------------------------
TOP TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {


}

/*
-----------------------------------------------
TOP SP
----------------------------------------------- */
@media screen and (max-width: 767px) {

.shotoku{
position:absolute;
top:12px;
left:8px;
}

.shotoku img{
width:120px;
height:auto;
}

.top-main-logo{
position: relative;
text-align:center;
padding-top:15%;
padding-bottom:18%;
}

.top-main-logo img{
width:170px;
height:auto;
text-align:center;
margin-left:auto;
margin-right:auto;
}

.top-lead{
font-size:15px;
letter-spacing:1px;
line-height:1.9;
padding-bottom:30px;
}

.p-top60{
padding-top:10px;
}

.top-box01{
width:100%;
background-image:url(../img/dotte.png);
background-repeat:no-repeat;
background-position:bottom left;
margin-left:-65px;
padding-left:50px;
padding-right:0px;
margin-right:-10px;
padding-bottom: 30px;
}

.top-box01 p{
line-height:1.4;
margin-top:10px;
}

.top-box01 p span{
display:inline-block;
padding:0.4em 1em;
background:#f1f0f0;
}
.top-box02{
width:100%;
}


.top-box03{
width:100%;
padding-left:10%;
padding-right:10%;
padding-bottom:20px;
}

.top-box03 h2{
padding-top:0px;
}

.top-box04{
width:100%;
}

.top-wrap1{
padding:20px 0 0 0;
}

.top-box04 h3{
font-size:20px;
margin-bottom:20px;
margin-top:8px;
}

.vol{
display:inline-block;
padding:0.3em 0.8em;
background:#fff;
font-weight:bold;
font-size:13px;
}

.top-box04 .tar{
padding-top:10px;
text-align:center;
}

}