@charset "UTF-8";
@import url('https://cdn.jsdelivr.net/npm/yakuhanjp@3.3.1/dist/css/yakuhanmp.min.css');
@import url('https://cdn.jsdelivr.net/npm/yakuhanjp@3.3.1/dist/css/yakuhanjp.min.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&family=Oswald:wght@200;300;400;500;600&family=Public+Sans:wght@100;200;300;400;500;600;700;800;900&display=swap');

html,body{font-family: YakuHanJP, 'Public Sans', 'Noto Sans JP', sans-serif;}
article{overflow: hidden;}

@media screen and (min-width: 769px) {
body{font-size: 16px;line-height: 1.6;}
.sp{display: none;}
.contents_wrap{max-width: 1240px;margin: 0 auto;padding: 0 20px;}
}

@media screen and (max-width: 768px) {
body{font-size: 3vw;line-height: 1.5;}
.pc{display: none;}
.contents_wrap{padding: 0 4vw;}
}

/*||||||||||||||||| ヘッダー＆メニュー |||||||||||||||||*/

header{background: rgba(255,255,255,0.9);position: fixed;width: 100%; top: 0;z-index: 1000;left: 0;height: 100px;padding: 0 25px;display: flex;justify-content: space-between;align-items: center;box-shadow: 0 0 5px rgba(0,0,0,0.3);opacity: 0;transition: 0.7s all;}
header.show{opacity: 1;}

header h1{display: flex;align-items: center;width: 420px;}
header h1 p{color: #002e5f;font-size: 16px;text-decoration: none;line-height: 1.6;margin-right: 1.3em;font-weight: 600;letter-spacing: 0.05em;padding-top: 0.1em;}
header h1 figure{width: 200px;}

header .menu{display: flex;justify-content: flex-end;width: calc(100% - 430px);}
header .menu a{text-align: center;border-right: 1px solid #333;display: flex;align-items: center;justify-content: center;height: 1.5em;font-size: 16px;color: #000;padding: 0 1em;}
header .menu a::after{position: absolute;bottom: -1px;left: 0;content: '';width: 100%;height: 1px;background: #000;transform: scale(0, 1);transform-origin: center top;transition: transform 0.3s;}
header .menu a:last-of-type{border-right: none;}

header .facebook_link{width: 40px;margin-left: 20px;transition: 0.3s all;}


@media screen and (max-width: 1600px) {
header{height: 6.25vw;padding: 0 1.5vw;}
header h1{width: 26.5vw;}
header h1 p{font-size: 1vw;}
header h1 figure{width: 12.5vw;}
header .menu{width: calc(100% - 26.875vw);}
header .menu a{font-size: 1vw;}
header .facebook_link{width: 2.5vw;margin-left: 1vw;}
}

@media only screen and (min-width: 769px) {
header .menu a:hover::after{transform: scale(0.9, 1);}
header .facebook_link:hover{opacity: 0.6;}
}

@media only screen and (max-width: 768px) {
header{background: none;padding: 0;height: 12vw;}
header h1{padding: 2vw;height: 100%;background: rgba(255,255,255,0.9);width: 100%;z-index: 1000;box-shadow: 0 0 1vw rgba(0,0,0,0.3);display: flex;align-items: center;}
header h1 p{display: none;}
header h1 figure{width: 30vw;}
header .facebook_link{width: 7vw;height: 7vw; margin-left: 0;position: absolute;right: 15vw;top: 0;bottom: 0;margin: auto 0;z-index: 1100;}

header.h_active .menu{transform: translateY(0%);}

header .menu{display: flex;width: 100%;margin-top: 0;transform: translateY(-150%);flex-wrap: wrap;transition: all 0.5s;border-top: 1px solid #888;position: absolute;top: 12vw;}
header .menu a{width: 50%; text-align: center;border-bottom:1px solid #888;display: flex;align-items:center;height: 10vw;background: rgba(255,255,255,0.9);flex: 0 1 auto;font-size:3.3vw;color: #000;}
header .menu a:nth-of-type(even){border-right:none;}

/*ハンバーガーメニュー*/
header .hb_menu{position: absolute;top:1vw;width: 8vw;height: 10vw;right: 3vw;z-index: 1100;transition: all 0.3s;}
header .hb_menu span{display: block;height: 0.7vw;width: 100%;position: absolute;top:0;bottom:0;left: 0;margin: auto 0;}
header .hb_menu span i{display: block;height: 0.7vw;width: 66%;transition: all 0.3s;background: #000;}
header .hb_menu span::before,
header .hb_menu span::after{content:"";position: absolute;left: 0; display: block;height: 0.7vw;width: 100%;background: #000;transition: all 0.3s;}
header .hb_menu span::after{width: 33%;}
header .hb_menu span::before{top:-2.5vw;}
header .hb_menu span::after{bottom:-2.5vw;}

header.h_active .hb_menu span::before{transform:rotate(-135deg);top:0;right:0;content:'';}
header.h_active .hb_menu span::after{transform:rotate(135deg);bottom:0;right:0;content:'';width: 100%;}
header.h_active .hb_menu span i{display: none;}
}

@media only screen and (min-width: 769px) {
header .hb_menu{display: none;}
}


/*||||||||||||||||| フッター（全ページ共通） |||||||||||||||||*/
footer{padding-bottom: 30px;}
.footer_up{background: #f7f7f7;padding: 30px 0;}
.footer_up > *{display: flex;justify-content: space-between;}
.footer_logo{display: flex;align-items: center;flex-wrap: wrap;}
.footer_logo p{color: #002e5f;font-size: 16px;line-height: 1.6;margin-right: 1.3em;font-weight: 600;letter-spacing: 0.05em;padding-top: 0.1em;}
.footer_logo span{color: #000;font-size: 15px;margin-top: 5px;width: 100%;}
.footer_logo span.sctaBax{font-size: 13px;margin-top: 5px;width: 100%;}
.footer_logo span.sctaBax a{color:#000;text-decoration:underline;}
.footer_logo span.sctaBax a:hover{text-decoration:none;}
.footer_logo figure{width: 200px;}
.footer_fb{display: flex;align-items: center;}
.footer_fb > p{font-size: 15px;}
.footer_fb > a{width: 40px;margin-left: 15px;transition: 0.3s all;}
footer .copyright{margin-top: 20px;text-align: right;font-size: 15px;}

@media only screen and (min-width: 769px) {
.footer_fb > a:hover{opacity: 0.6;}
}

@media only screen and (max-width: 768px) {
footer{padding-bottom: 6vw;}
.footer_up{padding: 9vw 0;}
.footer_up > *{flex-wrap: wrap;}
.footer_logo{justify-content: center;flex-direction: column;align-items: center; flex-wrap: wrap;width: 100%;}
.footer_logo p{font-size: 3.2vw;margin-right: 0;padding-top: 0;}
.footer_logo span{font-size: 3vw;margin-top: 3vw;width: auto;}
.footer_logo span.sctaBax{font-size: 2.8vw;margin-top: 3vw;width: auto;}
.footer_logo figure{width: 30vw;margin-top: 1vw;}
.footer_fb{flex-direction: column;align-items: center;width: 100%;margin-top: 6vw;}
.footer_fb > p{font-size: 3vw;}
.footer_fb > a{width: 8vw;margin: 1vw 0 0 0;}
footer .copyright{margin-top: 4vw;text-align: center;font-size: 3.3vw;}
}


