@charset "utf-8";

/*
Theme Name: sanpai_child
Template: sanpai_child
Author: labo
Author URI: https://takai-laboratory.com/
*/

/*========================*/
/*fade
***************/
/* 画面外にいる状態 */
.fadein {
opacity : 0;
transform : translate(0, 150px);
transition : all 1500ms;
}

/* 画面内に入った状態 */
.fadein.scrollin {
opacity : 1;
transform : translate(0, 0);
}
#wrap {overflow: hidden;}
body {opacity: 0; transition-duration: .5s; transition-delay: .2s;}
.indication {opacity: 1;}
.indent_content {padding: 80px 0;}
.indent_content02 {margin-top: 80px;}
.indent_content03 {margin-top: 50px;}
/******************************
HEADER
******************************/
header {background: #fff; padding: 10px 0;}
header .tel_box {font-size: 14px; line-height: 1;}
header .tel_box img {margin-right: 10px;}
header .tel_box .big {font-size: 39px; margin-bottom: 2px;}
header .mail {box-sizing: border-box; width: 200px; height: 50px; background: #281000; border: 1px solid #5c2806; line-height: 1; padding-right: 10px; margin-left: 20px;}
header .mail p {font-size: 14px; background: #5c2806; width: 145px; height: 30px;}
header .mail:nth-of-type(2) {background: #004e23; border-color: #005827;}
header .mail:nth-of-type(2) p {background: #009135;}
.front_main_box .list li:nth-child(1) {margin-top: 36px;}
.front_main_box .list li:nth-child(2) {margin-top: 18px;}
.front_main_box .tag_box {margin-top: 10px;}
.front_main_box .tag_box p {box-sizing: border-box; width: 150px; height: 33px; border-radius: 16.5px; background: #00451f; font-size: 20px; line-height: 1;}
.front_main_box .tag_box p:nth-child(2) {background: #009135; margin-left: 10px;}
.front_main_box .tag_box p:nth-child(3) {background: #00c347; margin-left: 10px;}
.front_main_box {position: relative; line-height: 1;}
.front_main_box .txt_box {position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; z-index: 10; width: 1200px; padding-bottom: 50px;}
.front_main_box .txt {font-size: 65px; position: relative;}
.front_main_box .txt span {font-size: 90px;}
.front_main_box .txt01 {padding-bottom: 40px; display: inline-block; margin-top: 15px;}
.front_main_box .txt01::after {content: ''; width: 100%; height: 5px; background: #fff; position: absolute; left: 0; bottom: 12px; opacity: 0; -webkit-transition: all .5s .6s cubic-bezier(.215,.61,.355,1);
    transition: all .5s .6s cubic-bezier(.215,.61,.355,1);
    -webkit-transition-property: opacity,-webkit-transform;
    transition-property: opacity,-webkit-transform;
    transition-property: opacity,transform;
    transition-property: opacity,transform,-webkit-transform;
    -webkit-transform: scale(.55,1);
    transform: scale(.55,1);
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;}
.front_main_box .icon {position: absolute; right: 0; top: 0; bottom: 0; margin: auto; padding-bottom: 75px;}
.front_main_box .c_txt {position: absolute; left: 20px; top: 0; bottom: 0; margin: auto; display: flex; justify-content: center; align-items: flex-start; font-size: 20px; line-height: 1;-moz-writing-mode: vertical-rl; writing-mode: vertical-rl; -webkit-writing-mode: vertical-rl; z-index: 20; text-align: center; letter-spacing: 1.5px; -ms-writing-mode: tb-rl;}
.inview .fade_under{-webkit-animation: mainCopy .8s .6s cubic-bezier(.215,.61,.355,1) both; animation: mainCopy .8s .6s cubic-bezier(.215,.61,.355,1) both;}
.front_main_box.inview .txt01::after {-webkit-transition-delay: 1.2s; transition-delay: 1.2s; opacity: 1; -webkit-transform: scale(1,1); transform: scale(1,1);}

@-webkit-keyframes mainCopy{0%{opacity:0;-webkit-transform:translateX(0) translateY(20px);transform:translateX(0) translateY(20px)}100%{opacity:1;-webkit-transform:translateX(0) translateY(0);transform:translateX(0) translateY(0)}}@keyframes mainCopy{0%{opacity:0;-webkit-transform:translateX(0) translateY(20px);transform:translateX(0) translateY(20px)}100%{opacity:1;-webkit-transform:translateX(0) translateY(0);transform:translateX(0) translateY(0)}}@-webkit-keyframes mainCopy-first{0%{opacity:0;-webkit-transform:translateX(10px);transform:translateX(10px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes mainCopy-first{0%{opacity:0;-webkit-transform:translateX(10px);transform:translateX(10px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@-webkit-keyframes mainCopy-hide{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes mainCopy-hide{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(10px);transform:translateX(10px)}}





/*scroll*/
.kv__scroll {
position: absolute; right: 20px; top: 0; bottom: 0; margin: auto; -moz-writing-mode: vertical-rl; writing-mode: vertical-rl; -webkit-writing-mode: vertical-rl; z-index: 20; text-align: center; letter-spacing: 1.5px; padding-bottom: 30px;}
.kv__scroll__inner {position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: end;
    align-items: flex-end;
    flex-wrap: wrap;
    margin: 0 auto;
    -ms-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    -ms-flex-wrap: wrap;
    -webkit-box-align: end;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl; padding-bottom: 100px;}
.kv__scroll__inner::before {position: absolute;
    left: 50%;
    z-index: 90;
    margin: 0 auto;
    width: 1px;
    content: "";
    font-size: 1.3rem;   
	bottom: -90px;
    height: 175px;
    background: #e6edf1;}
.kv__scroll__label {
	    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    -ms-flex-align: center;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    color: #fff;
    letter-spacing: .03em;
    font-weight: 500;
    font-family: heebo,sans-serif;
    line-height: 1;
    -webkit-box-align: center;
    -webkit-box-pack: center;
}
.kv__scroll__text {padding-left: 2px; font-size: 1rem;}
.kv__scroll__point {position: absolute;
    left: 50%;
    z-index: 100;
    margin-left: -3.5px;
    width: 7px;
    height: 7px;
bottom: 6.5rem;
    -webkit-animation: scroll-point 2.6s ease-out infinite;
    animation: scroll-point 2.6s ease-out infinite;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;}
.kv__scroll__point:after, .kv__scroll__point:before {    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    content: "";
    -ms-border-radius: 50%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;}
.kv__scroll__point:before {    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -ms-border-radius: 50%;}
.kv__scroll__point:before {    
	z-index: 0;
    background: rgba(255,255,255,.2);
    -webkit-animation: scroll-point-zoom 2.6s ease-out infinite;
    animation: scroll-point-zoom 2.6s ease-out infinite;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;}
.kv__scroll__point:after {background: #009135;}
@-webkit-keyframes scroll-point{0%{bottom:6.5rem;opacity:0}20%{opacity:1}48%{bottom:-4.28571em;opacity:1}70%{opacity:0}100%{bottom:-4.28571em;opacity:0}}@keyframes scroll-point{0%{bottom:6.5rem;opacity:0}20%{opacity:1}48%{bottom:-4.28571em;opacity:1}70%{opacity:0}100%{bottom:-4.28571em;opacity:0}}@-webkit-keyframes scroll-point-sp{0%{bottom:4.5em;opacity:0}20%{opacity:1}40%{bottom:0;opacity:1}70%{opacity:0}100%{bottom:0;opacity:0}}@keyframes scroll-point-sp{0%{bottom:4.5em;opacity:0}20%{opacity:1}40%{bottom:0;opacity:1}70%{opacity:0}100%{bottom:0;opacity:0}}@-webkit-keyframes scroll-point-zoom{0%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}20%{opacity:1}40%{opacity:0;-webkit-transform:scale(4);-moz-transform:scale(4);-ms-transform:scale(4);-o-transform:scale(4);transform:scale(4)}70%{opacity:0}100%{opacity:0;-webkit-transform:scale(4);-moz-transform:scale(4);-ms-transform:scale(4);-o-transform:scale(4);transform:scale(4)}}@keyframes scroll-point-zoom{0%{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}20%{opacity:1}40%{opacity:0;-webkit-transform:scale(4);-moz-transform:scale(4);-ms-transform:scale(4);-o-transform:scale(4);transform:scale(4)}70%{opacity:0}100%{opacity:0;-webkit-transform:scale(4);-moz-transform:scale(4);-ms-transform:scale(4);-o-transform:scale(4);transform:scale(4)}}@-webkit-keyframes scroll-point-zoom-sp{0%{opacity:0;-webkit-transform:scale(.2) translateY(-50%) translateX(-50%);-moz-transform:scale(.2) translateY(-50%) translateX(-50%);-ms-transform:scale(.2) translateY(-50%) translateX(-50%);-o-transform:scale(.2) translateY(-50%) translateX(-50%);transform:scale(.2) translateY(-50%) translateX(-50%)}40%{-webkit-transform:scale(1) translateY(-50%) translateX(-50%);-moz-transform:scale(1) translateY(-50%) translateX(-50%);-ms-transform:scale(1) translateY(-50%) translateX(-50%);-o-transform:scale(1) translateY(-50%) translateX(-50%);transform:scale(1) translateY(-50%) translateX(-50%)}50%{opacity:1}100%{opacity:0;-webkit-transform:scale(1) translateY(-50%) translateX(-50%);-moz-transform:scale(1) translateY(-50%) translateX(-50%);-ms-transform:scale(1) translateY(-50%) translateX(-50%);-o-transform:scale(1) translateY(-50%) translateX(-50%);transform:scale(1) translateY(-50%) translateX(-50%)}}@keyframes scroll-point-zoom-sp{0%{opacity:0;-webkit-transform:scale(.2) translateY(-50%) translateX(-50%);-moz-transform:scale(.2) translateY(-50%) translateX(-50%);-ms-transform:scale(.2) translateY(-50%) translateX(-50%);-o-transform:scale(.2) translateY(-50%) translateX(-50%);transform:scale(.2) translateY(-50%) translateX(-50%)}40%{-webkit-transform:scale(1) translateY(-50%) translateX(-50%);-moz-transform:scale(1) translateY(-50%) translateX(-50%);-ms-transform:scale(1) translateY(-50%) translateX(-50%);-o-transform:scale(1) translateY(-50%) translateX(-50%);transform:scale(1) translateY(-50%) translateX(-50%)}50%{opacity:1}100%{opacity:0;-webkit-transform:scale(1) translateY(-50%) translateX(-50%);-moz-transform:scale(1) translateY(-50%) translateX(-50%);-ms-transform:scale(1) translateY(-50%) translateX(-50%);-o-transform:scale(1) translateY(-50%) translateX(-50%);transform:scale(1) translateY(-50%) translateX(-50%)}}
@media screen and (max-width:1500px) {
	.front_main_box .c_txt,.kv__scroll {display: none;}
}
@media screen and (max-width:1300px) {
	.paging_box {display: none;}
}

/*slide*/
.swiper-button-prev,.swiper-button-next {display: none} 
.slider {height: 100%; width: 100%;}
.slider .swiper-slide img {height: 100%; object-fit: cover; object-position: center; width: 100%;}

.slider .swiper-slide-active img,
.slider .swiper-slide-duplicate-active img,
.slider .swiper-slide-prev img{
    animation: fadezoom 10s 0s forwards;
}
@keyframes fadezoom {
    0% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}

.slider-thumbnail {position: absolute; left: 0; right: 0; z-index: 20; overflow: inherit; width: 1200px; margin: auto; bottom: -18px;}
.slider-thumbnail .swiper-wrapper {display: flex; justify-content: flex-end;}
.slider-thumbnail .swiper-slide {width: 110px!important; box-sizing: border-box; border: 3px solid #d2d2d2; margin-left: 10px;}
.swiper-slide {overflow: hidden;}
.slider-thumbnail .swiper-slide-thumb-active {border-color: #5c2806;}
.slider-thumbnail .swiper-slide:nth-child(1) {margin-left: 0;}
.slide-img {height: 100%;}
.paging_box {position: absolute; bottom: 50px; left: 0; right: 0; margin: auto; z-index: 20; width: 1200px;}
#paging {
position: relative;
}
#paging li {
height: 2px; background: #fff; cursor: pointer; position: absolute; left: 0; top: 0; width: 680px; opacity: 0;
}
#paging li.active {z-index: 100; position: relative; opacity: 1;}
#paging li:last-child {
	border-right: none;
}
#paging li:hover {
	background: #ddd;
}
#paging li span {
	display: block;
	width: 0;
	height: 100%;
}
#paging li.active span {
	background: #009a44;
}


.front_contact_box {background: #fff; padding: 20px 0 10px; width: 100%; line-height: 1;}
.front_contact_box h1 {font-size: 16px; margin-bottom: -5px;}
.front_contact_box .mail {box-sizing: border-box; width: 250px; height: 50px; background: #371600; border: 1px solid #5c2806; line-height: 1; position: relative;}
.front_contact_box .mail p {font-size: 14px; background: #5c2806; width: 180px; height: 30px;}
.front_contact_box .mail:nth-child(2) {background: #004e23; border-color: #005827;}
.front_contact_box .mail:nth-child(2) p {background: #009135;}
.front_contact_box .icon {position: absolute; right: 8px; top: 0; bottom: 0; margin: auto;}
.front_contact_box .tel {font-size: 60px;}
.front_contact_box .tel span {font-size: 80px;}
.global_nav_bg {background: #000; padding: 15px 0;}
.global_nav {display: table;}
.global_nav a {box-sizing: border-box; border-right: 1px solid #fff; font-size: 16px; line-height: 1; display: table-cell; position: relative;}
.global_nav a:first-child {border-left: 1px solid #fff;}
.global_nav a p {position: relative; display: inline;}
.global_nav a p::after {
  position: absolute;
  bottom: -5px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #fff;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
.global_nav a:hover p::after {
  transform: scale(1, 1);
}


/*index*/
#index .box01 {background: url("img/index/box01_bg.jpg")top left repeat;}
#index .box01 .con,.popup .con {box-sizing: border-box; border: 3px solid #000; padding: 50px; background: rgba(255,255,255,.4);}
#index .box01 .title_box,.popup .title_box {width: 700px; margin: auto;}
#index .box01 .title_box p,.popup .title_box p {font-size: 50px; line-height: 1; box-sizing: border-box; border-bottom: 2px solid #000; text-align: left; padding-bottom: 20px; margin-bottom: 20px;}
#index .box01 h2,.popup h2 {font-size: 35px; text-align: right;}
#index .box01 .progress01 {margin: 50px auto 130px;}
.popup .progress {margin: 50px auto;}
#index .box01 .con_part,.popup .con_part {margin-top: 50px; box-sizing: border-box; border-bottom: 2px solid #000; padding-bottom: 50px;}
#index .box01 .title_txt,.popup .title_txt {font-size: 30px; line-height: 1; margin-bottom: 20px;}
#index .box01 .btn,.popup .btn {box-sizing: border-box; position: relative; width: 690px; background: #000; margin: 0 auto; font-size: 25px; line-height: 1; padding: 37px 0; text-align: center; cursor: pointer; display: block; font-weight: bold; border: none; overflow: visible;}
#index .box01 .btn::after {content: ''; width: 100px; height: 1px; background: #fff; position: absolute; left: 0; top: 0; bottom: 0; margin: auto;}
#index .box01 .btn::before,.popup .btn::before {position: absolute; left: 0; top: -90px; background: url("img/index/box01_btn_icon03.svg")no-repeat; width: 690px; height: 124px; content: '';}
#index .box01 .btn:nth-child(2),.popup .btn:nth-child(2) {background: #009135;}
#index .box01 .btn:nth-child(2)::before,.popup .btn:nth-child(2)::before {background: url("img/index/box01_btn_icon04.svg")no-repeat; width: 527px; height: 114px;}
.popup .list {width: 1000px; margin: auto; font-size: 16px; line-height: 1;}
.popup .list li {box-sizing: border-box; width: 320px; margin-right: 20px; position: relative;}
.popup .list label {background: #fff; width: 100%; position: relative; border: 1px solid #009135;}
.popup .link_inner div {width: 320px; height: 60px; position: relative; text-align: center; font-size: 16px; line-height: 1; cursor: pointer;}
.popup .list label p {width: 100%; text-align: center;}
.popup .link_inner div::before {content: ''; position: absolute; background: #fff; width: 30px; height: 1px; left: 0; top: 0; bottom: 0; margin: auto;}
.popup .link_inner div:nth-child(1) {background: #5c2806;}
.popup .link_inner div:nth-child(2) {background: #009135;}
.popup .link_inner div:nth-child(3) {background: #009da7;}
#index .box01 .list li:nth-child(3n),.popup .list li:nth-child(3n) {margin-right: 0;}
#index .box01 .list li:nth-child(n + 4),.popup .list li:nth-child(n + 4) {margin-top: 20px;}
#index .box01 .list .bdr,.popup .list .bdr {content: ''; display: block; background: #009135; width: 30px; height: 1px;}
#index .box01 .list li img,.popup .list li img {box-sizing: border-box; border-left: 1px solid #009135;}
#index .box01 .list li input[type="radio"],.popup .list li input[type="radio"] {position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; opacity: 0; width: 100%; height: 100%; z-index: 100; cursor: pointer;}
#index .box01 .fade_l.inview {opacity: 1; transform: translateX(0);}

.popup .text01 {font-size: 20px; line-height: 1; margin-bottom: 10px; display: flex; align-items: center; justify-content: center;}
.popup .text02 {margin-bottom: 50px; font-size: 16px; line-height: 1; color: #EE0000;}
.popup .list02 li {width: 490px;}
.popup .list02 li:nth-child(3n) {margin-right: 20px;}
.popup .list02 li:nth-child(2n) {margin-right: 0;}
.popup .list02 li:nth-child(n + 3) {margin-top: 20px;}
.popup .ul02 {margin-top: 20px;}
.popup .text_input {box-sizing: border-box; border: 3px solid #009135; width: 485px; height: 50px; font-size: 20px; line-height: 1; padding: 0 10px; outline: none;}
.popup .input_btn {box-sizing: border-box; width: 450px; background: #009135; font-size: 20px; line-height: 1; padding: 16px 0; margin: 20px auto 0; outline: none;}
.popup .next_btn {display: block; margin: 50px auto 0; font-size: 16px; font-weight: bold; width: 400px; height: 60px; background: url("img/index/box01_next_arrow.svg")center right 20px no-repeat; background-color: #000; outline: none; border: none; color: #fff; cursor: pointer; margin-top: 50px;}
.featherlight .featherlight-close-icon {width: 65px; height: 65px; background: #009135; top: 50px; right: 50px; color: #fff; font-size: 25px; font-weight: bold; box-sizing: border-box; outline: none;}

.popup .select_example {
  width: 100px;
  position: relative;
  background: #009135;
  cursor: pointer;
 box-sizing: border-box; border-right: 10px solid #004e23; height: 50px; display: flex; align-items: center; justify-content: center;
}
.popup .select_example::after {content: ''; position: absolute; background: url("img/index/example_arrow.svg")no-repeat; width: 6px; height: 4px; top: 0; bottom: 0; right: -8px; margin: auto;}

.label {
  color: #fff;
  position: absolute;
  width: 100%;
  z-index: 1;
	font-size: 20px; line-height: 1; display: flex; align-items: center; justify-content: center;
}

.select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  cursor: pointer;
  width: 100%;
  border: none;
  padding: 20px;
  opacity: 0;
  position: relative;
  z-index: 2;
 font-size: 16px;
}

/* IE10以上で矢印を消す */
.select::-ms-expand {
  display: none; 
}

/* フォーカス時 */
.select:focus {
  z-index: -1;
  opacity: 1;
}
#index .big_img {position: relative; min-width: 1920px; left: 50%; margin-left: -960px;}

/* 元々のチェックボックス（非表示） */
.popup input[type="checkbox"]{
    opacity: 0; width: 100%; height: 100%; position: absolute; cursor: pointer; z-index: 10; margin: 0;
}
/* ラベルの左に表示させる正方形のボックス□ */
.popup input[type="checkbox"]+label::before{
    content: "";
    position: absolute;
    display: block;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    left: 20px;
    top: 50%;
    border: 1px solid #009135;
    background-color: #FFF; /* 背景の色変更 お好きな色を */
}
/* チェックが入った時のレ点 */
.popup input[type="checkbox"]:checked+label::after{
    content: "";
    position: absolute;
    display: block;
    box-sizing: border-box;
    width: 18px;
    height: 9px;
    margin-top: -9px;
    top: 50%;
    left: 23px;
    transform: rotate(-45deg);
    border-bottom: 3px solid;
    border-left: 3px solid;
    border-color: #000; /* チェックの色変更 お好きな色を */
}

.popup .con_part01 .list label {border-color: #5c2806;}
.popup .con_part01 input[type="checkbox"]+label::before {border-color: #5c2806;}
.popup .con_part01 .list .bdr {background: #5c2806!important;}
.popup .con_part01 .list li img {border-color: #5c2806!important;}

.popup .con_part03 .list label {border-color: #009da7;}
.popup .con_part03 input[type="checkbox"]+label::before {border-color: #009da7;}
.popup .con_part03 .list .bdr {background: #009da7!important;}
.popup .con_part03 .list li img {border-color: #009da7!important;}

.popup {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: .6s;
}
.popup.is-show {
  opacity: 1;
  visibility: visible;
}
.popup-inner {
	position: absolute;
	padding: 25px; background-color: #fff; z-index: 2; height: calc(100% - 100px); box-sizing: border-box; overflow-y: scroll; width: 1200px; top: 0; bottom: 0; left: 0; right: 0; margin: auto;
}
.close-btn {
  position: absolute;
  right: 25px;
  top: 25px;
  width: 65px;
  height: 65px;
  text-align: center;
  cursor: pointer;
  z-index: 100; background: #009135;
}
.close-btn::before,.close-btn::after {content: ''; position: absolute; background: #fff; width: 40px; height: 2px; top: 0; bottom: 0; left: 0; right: 0; margin: auto;}
.close-btn::before {transform: rotate(45deg);}
.close-btn::after {transform: rotate(-45deg);}

.black-background {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.8);
  z-index: 1;
  cursor: pointer;
}



#contact01 {background: url("img/index/box01_bg.jpg")top left repeat; padding-bottom: 80px;}
#contact01 .con {box-sizing: border-box; border: 3px solid #000; padding: 50px; background: rgba(255,255,255,.4);}
#contact01 .title_box {width: 700px; margin: auto;}
#contact01 .title_box p {font-size: 50px; line-height: 1; box-sizing: border-box; border-bottom: 2px solid #000; text-align: left; padding-bottom: 20px; margin-bottom: 20px;}
#contact01 h2 {font-size: 35px; text-align: right;}
#contact01 .progress {margin: 50px auto;}
#contact01 table {width: 100%; box-sizing: border-box; border: 1px solid #e6e6e6;}
#contact01 table th,#contact01 table td {padding: 10px 20px; box-sizing: border-box; font-size: 16px; font-weight: 500; border-bottom: 1px solid #e6e6e6; background: #fff;}
#contact01 table th{vertical-align: middle; width: 297px; position: relative; background: #009135; font-weight: 500; border-bottom: 1px solid #fff; color: #fff;}
#contact01 table input,#contact01 table textarea,#contact01 table td p {width: 100%; box-sizing: border-box; padding: 5px 10px; font-size: 16px; outline: none; background: #efefef; border: none; min-height: 46px; font-weight: bold;}
#contact01 table td p {line-height: 1; display: flex; align-items: center;}

#contact01 table textarea {font: inherit; font-size: 16px;}
#contact .thanks {font-size: 16px; line-height: 2; font-weight: 500;}
#contact01 .form_btn {box-sizing: border-box; background: url("img/index/form_arrow.svg")left 80px center no-repeat; background-color: #000; font-size: 20px; line-height: 1; font-weight: bold; color: #fff; display: block; margin: 50px auto 0; border: none; width: 450px; padding: 20px 0; cursor: pointer;}
#contact01 .essential {color: #009135; display: flex; align-items: center; line-height: 1; top: 0; bottom: 0; right: 20px; margin: auto; position: absolute; background: #fff; height: 20px; font-size: 14px;}
#contact01 table amount_box span:nth-child(1) input {border-right: none;}
#contact01 .text01 {font-size: 25px; line-height: 1; margin-bottom: 30px;}
#contact01 .text_area textarea {height: 120px;}
#contact01 input[type="checkbox"] {display: none;}
#contact01 .select_area {width: 100%; box-sizing: border-box; padding: 5px 10px 5px 0; font-size: 16px; outline: none; background: #efefef; border: none; min-height: 46px; font-weight: bold; display: flex; align-items: center;}
#contact01 .select_area .wpcf7-list-item {margin: 0 0 0 10px;}


::placeholder {
  color: #ccc;
}

/* IE */
:-ms-input-placeholder {
  color: #ccc;
}

/* Edge */
::-ms-input-placeholder {
  color: #ccc;
}

#index .box02 {background: url("img/index/box02_bg02.jpg")top center no-repeat; position: relative; padding-bottom: 30px; box-sizing: border-box; border-top: 7px solid #009135;}
#index .box02 .bg {box-sizing: border-box; background: url("img/index/box02_bg01.jpg")top left repeat; width: 100%; height: 122px; position: absolute; content: ''; display: block; bottom: 0; left: 0;}
#index .box02 .txt01 p {font-size: 50px; box-sizing: border-box; border-bottom: 2px solid #000; width: 700px; padding-bottom: 10px; line-height: 1; margin-bottom: 20px;}
#index .box02 .txt01::before {content: ''; position: absolute; width: 250px; height: 14px; top: -80px; left: 0; background: #009135;}
#index .box02 h2 span {font-size: 35px; width: 700px; text-align: right; display: inline-block;}
#index .box02 .inner {margin: 40px auto;}
#index .box02 .inner::after {content: ''; position: absolute; background: url("img/index/box02_icon.svg")no-repeat; width: 559px; height: 565px; top: -200px; right: -50px;}
#index .box02 h3 {font-size: 30px; line-height: 1.7; margin-bottom: 30px;}
#index .box02 .txt {font-size: 16px; line-height: 2.3; width: 650px;}
#index .box02 .img {position: relative; z-index: 10;}
.inview .x_btn .btn_item01,.inview .x_btn .btn_item02 {
	-webkit-transition: -webkit-transform .45s cubic-bezier(.79,.17,.15,.96);
    transition: -webkit-transform .45s cubic-bezier(.79,.17,.15,.96);
    transition: transform .45s cubic-bezier(.79,.17,.15,.96);
    transition: transform .45s cubic-bezier(.79,.17,.15,.96),-webkit-transform .45s cubic-bezier(.79,.17,.15,.96); opacity: 0; transition-delay: 1s;
}
.inview .x_btn .btn_item01,.inview .btn_item01 {
	-webkit-transform: translate3d(-100%,0,0) rotate(-45deg);
    transform: translate3d(-100%,0,0) rotate(-45deg);
    -webkit-transition: .5s cubic-bezier(.29,.8,.35,1);
    transition: .5s cubic-bezier(.29,.8,.35,1);
	border-color: #000;
	transition-delay: 1s;
}
.inview .x_btn .btn_item02,.inview .btn_item02 {
	-webkit-transform: translate3d(100%,0,0) rotate(-45deg);
    transform: translate3d(100%,0,0) rotate(-45deg);
    -webkit-transition: .5s cubic-bezier(.29,.8,.35,1);
    transition: .5s cubic-bezier(.29,.8,.35,1);
	border-color: #000;
	transition-delay: 1s;
}
.inview .x_btn {color: #fff; background-color: #009135; transition-delay: 1s;}
.inview .x_btn .arrow,.inview .arrow {
	-webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    opacity: 1;
    -webkit-transition: opacity .2s .2s,-webkit-transform .3s .1s cubic-bezier(.79,.17,.15,.96);
    transition: opacity .2s .2s,-webkit-transform .3s .1s cubic-bezier(.79,.17,.15,.96);
    transition: transform .3s .1s cubic-bezier(.79,.17,.15,.96),opacity .2s .2s;
    transition: transform .3s .1s cubic-bezier(.79,.17,.15,.96),opacity .2s .2s,-webkit-transform .3s .1s cubic-bezier(.79,.17,.15,.96);
	left: 17px;
	transition-delay: 1s;
}






#index .box03 {width: 50%; box-sizing: border-box; position: relative; transition-duration: .5s; overflow: hidden;}
#index .box03 .txt_box {position: absolute; z-index: 10; padding: 80px; box-sizing: border-box; width: 100%; height: 100%;}
#index .box03 .img {opacity: .3; height: 497px; object-fit: cover;}
#index .box03 .txt01 {font-size: 40px; line-height: 1; box-sizing: border-box; border-bottom: 2px solid #000; padding-bottom: 20px; margin-bottom: 20px; transition-duration: .5s; transition-property: border-color;}
#index .box03 h2 {font-size: 30px;}
#index .box03 .txt02 {font-size: 20px; line-height: 1.5; margin: 50px auto 80px;}
#index .box03:hover {background: #000; color: #fff;}
#index .box03:hover .txt01 {border-color: #fff;}
#index .box03::before,#index .box03::after,#index .box03 .txt_box::before,#index .box03 .txt_box::after {content: ''; position: absolute; background: #fff; transition-duration: .3s; transition-timing-function: ease-in-out; z-index: 10;}
#index .box03::before {bottom: 5px; left: -100%; width: calc(100% - 10px); height: 1px; transition-delay: .3s;}
#index .box03::after {bottom: -100%; right: 5px; width: 1px; height: calc(100% - 10px); transition-delay: .5s;}
#index .box03 .txt_box::before {top: 5px; right: -100%; width: calc(100% - 10px); height: 1px; transition-delay: .3s;}
#index .box03 .txt_box::after {top: -100%; left: 5px; width: 1px; height: calc(100% - 10px); transition-delay: .5s;}
#index .box03:hover::before {left: 5px;}
#index .box03:hover::after {bottom: 5px;}
#index .box03:hover .txt_box::before {right: 5px;}
#index .box03:hover .txt_box::after {top: 5px;}


#index .box05 {background: url("img/index/box05_bg.jpg")top center no-repeat;}
#index .box05 .txt01 {width: 700px; margin: 0 auto 20px; box-sizing: border-box; border-bottom: 2px solid #000; font-size: 50px; line-height: 1; padding-bottom: 15px;}
#index .box05 h2 {width: 700px; margin: 0 auto; font-size: 35px;}
#index .box05 .txt02 {font-size: 18px; line-height: 2; margin: 50px auto;}
#index .box05 li {width: 366px;}
#index .box05 .txt03 {font-size: 14px; color: #a3a3a3; margin-top: 20px;}
#index .box06 {background: url("img/index/box06_bg.jpg")top left repeat;}
#index .box06 .txt01 {position: relative; width: 500px; margin: 0 auto 20px; box-sizing: border-box; border-bottom: 2px solid #000; padding-bottom: 20px; font-size: 50px; line-height: 1;}
#index .box06 .txt01::before,#index .box06 .txt01::after {content: ''; position: absolute; top: -40px;}
#index .box06 .txt01::before {background: url("img/index/box06_icon01.svg")no-repeat; width: 141px; height: 164px; left: -250px;}
#index .box06 .txt01::after {background: url("img/index/box06_icon02.svg")no-repeat; width: 120px; height: 164px; right: -250px;}
#index .box06 h2 {font-size: 35px; width: 500px; margin: auto;}
#index .box06 .list {margin-top: 80px;}
#index .box06 dl:nth-child(1) dt,#index .box06 dl:nth-child(2) dt {border-top: 1px solid #000;}
#index .box06 dt {box-sizing: border-box; border-bottom: 1px solid #000; padding: 10px 30px 10px 0; cursor: pointer; position: relative; font-size: 18px; line-height: 1.3;}
#index .box06 dd {box-sizing: border-box; display: none; padding: 10px 10px 10px 0; background: #fff; border-bottom: 1px solid #000; font-size: 14px;}
#index .box06 #acMenu {width: 575px;}
#index .box06 dl img {margin-right: 10px;}
#index .box06 dt::before {content: ''; display: block; width: 20px; height: 2px; position: absolute; right: 0; top: 0; bottom: 0; margin: auto; background: #000;}
#index .box06 dt::after {content: ''; display: block; width: 2px; height: 20px; position: absolute; right: 9px; top: 0; bottom: 0; margin: auto; background: #000;}
#index .box07 {box-sizing: border-box; background: url("img/index/box07_bg.jpg")top center no-repeat;}
#index .box07 .txt01 {font-size: 60px; line-height: 1; box-sizing: border-box; border-bottom: 5px solid #fff; padding-bottom: 25px; margin-bottom: 15px;}
#index .box07 .txt01 span {font-size: 80px;}
#index .box07 .txt02 {font-size: 60px; line-height: 1;}
#index .box07 .txt03 {font-size: 20px; line-height: 1.5; margin-bottom: 10px;}
#index .box07 .txt04 {font-size: 35px; line-height: 1;}
#index .box07 .btn_box {margin-top: 20px;}
#index .box07 .box {box-sizing: border-box; width: 475px; position: relative; padding: 15px 0 50px;}
#index .box07 .box:nth-child(1) {border: 3px solid #002f15; background: url("img/index/box07_box_bg01.jpg")top left repeat;}
#index .box07 .box:nth-child(2) {border-color: #371600; background: url("img/index/box07_box_bg02.jpg")top left repeat;}
#index .box07 .box .btn {box-sizing: border-box; width: 370px; border: 2px solid; background: #fff; line-height: 1; padding: 20px 0; font-size: 16px; transition-duration: .5s; position: absolute; right: 0; left: 0; bottom: -30px; z-index: 10; margin: auto; height: 60px;}
#index .box07 .box .btn::before,#index .box07 .box .btn::after {content: ''; position: absolute; display: block; width: 10px; height: 1px; right: 20px; margin: auto; background: #002f15; transition-duration: .5s;}
#index .box07 .box .btn::before {transform: rotate(45deg); top: 24px;}
#index .box07 .box .btn::after {transform: rotate(-45deg); bottom: 24px;}
#index .box07 .box:nth-child(2) .btn::before,#index .box07 .box:nth-child(2) .btn::after {background: #371600;}
#index .box07 .box:nth-child(1) .btn {border-color: #002f15; color: #002f15;}
#index .box07 .box:nth-child(2) .btn {border-color: #371600; color: #371600;}
#index .box07 .box:nth-child(1) .btn:hover {background: #002f15; color: #fff;}
#index .box07 .box:nth-child(2) .btn:hover {background: #371600; color: #fff;}
#index .box07 .box .btn:hover::before,#index .box07 .box .btn:hover::after {background: #fff;}
#index .box08 {background: url("img/index/box08_bg.jpg")top left repeat; padding: 244px 0 80px; margin-top: -114px;}
#index .box08 .box {width: 575px; position: relative;}
#index .box08 .title {box-sizing: border-box; border-left: 5px solid #009135; padding-left: 20px; margin-bottom: 30px;}
#index .box08 h2 {font-size: 30px; box-sizing: border-box; border-bottom: 2px solid #000; width: 300px; padding-bottom: 5px; margin-bottom: 5px;}
#index .box08 .title p {width: 300px; font-size: 25px; line-height: 1;}
#index .box08 .item {box-sizing: border-box; border-bottom: 1px dotted #000; padding: 20px 0 15px;}
#index .box08 .item:nth-of-type(1) {padding-top: 0;}
#index .box08 .time {box-sizing: border-box; font-size: 16px; line-height: 1; margin-right: 20px;}
#index .box08 h3 {font-size: 16px;}
#index .box08 .text {font-size: 14px; line-height: 1.7; margin-top: 15px;}
#index .box08 .btn {box-sizing: border-box; width: 200px; height: 40px; font-size: 16px; line-height: 1; background: #009135; position: absolute; top: 0; right: 0;}
#index .box08 .btn::before,#index .box08 .btn::after {content: ''; position: absolute; display: block; width: 10px; height: 1px; right: 20px; margin: auto; background: #fff;}
#index .box08 .btn::before {transform: rotate(45deg); top: 16px;}
#index .box08 .btn::after {transform: rotate(-45deg); bottom: 16px;}
#index .box08 .box:nth-child(2) .title {border-color: #592914;}
#index .box08 .box:nth-child(2) .btn {background: #592914;}
#index .box09 {background: url("img/index/box09_bg.jpg")top center no-repeat;}
#index .box09 .txt01 {box-sizing: border-box; border-bottom: 2px solid #fff; width: 500px; line-height: 1; padding-bottom: 20px; margin: 0 auto 20px; font-size: 50px;}
#index .box09 h2 {font-size: 35px; width: 500px; margin: auto;}
#index .box09 .text {font-size: 16px; line-height: 1.7; margin-top: 50px;}
#index .box10 a {box-sizing: border-box; width: 285px; font-size: 16px; line-height: 1; background: #009135;}
#index .box10 a:nth-child(2n) {background: #592914;}




/*========================
FOOTER
========================*/
footer {background: url("img/footer/bg.jpg")top left repeat; padding-top: 80px;}
footer .link_box {font-size: 16px; line-height: 1;}
footer .link_box:nth-of-type(1) {margin: 80px auto 30px;}
footer .link_box a {margin-left: 35px;}
footer .link_box a:nth-child(1) {margin-left: 0;}



footer .copyright {background-color: #000; padding: 10px 0; font-size: 12px; position: relative; z-index: 10; margin-top: 80px;}
footer .copyright p:last-child {margin-left: 10px;}
#pop_banner {position: fixed; bottom: 20px; z-index: 100; width: 100%;}
#pop_banner .inner {width: 1000px; margin: auto; background: #eee; box-sizing: border-box;}
#pop_banner .icon {box-sizing: border-box; -webkit-transition: all 0.5s ease; background-color: #009135; margin-right: 2px;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all  0.5s ease;
}
#pop_banner .icon:hover {
  background-color: #004e23;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all  0.5s ease;}
#pop_banner .icon:hover img {opacity: 1;}


/*pankuzu*/
.pan {padding: 40px 0;}
.pan p {font-weight: bold; margin: 0 auto;}
.pan a {display: inline;}
.pan a:nth-child(1) {box-sizing: border-box; border-bottom: 1px solid #aaa;}
/*========================
ページ設定
========================*/
/*
サムネ
*************/
.page_thumb {
width: 100%;
margin: auto;
box-sizing: border-box; 
height: 500px;
position: relative;
}
.page_thumb p {font-size: 40px; line-height: 1; height: 100%;}
.page_thumb p span{position: relative; z-index: 10;}
.thumb01 {background: url("img/thumb01.jpg")top center no-repeat;}
.thumb02 {background: url("img/thumb02.jpg")top center no-repeat;}
.thumb03 {background: url("img/thumb03.jpg")top center no-repeat;}
.thumb04 {background: url("img/thumb04.jpg")top center no-repeat;}
.thumb05 {background: url("img/thumb05.jpg")top center no-repeat;}
.thumb06 {background: url("img/thumb06.jpg")top center no-repeat;}
.thumb07 {background: url("img/thumb07.jpg")top center no-repeat;}
.thumb08 {background: url("img/thumb08.jpg")top center no-repeat;}
.thumb09 {background: url("img/thumb09.jpg")top center no-repeat;}
.thumb10 {background: url("img/thumb10.jpg")top center no-repeat;}
.thumb11 {background: url("img/thumb11.jpg")top center no-repeat;}



/*****************
width480px以下
*****************/
@media screen and (max-width:480px) {
.page_thumb img {
height: 120px;
}
}

/*
タイトル
*************/
.page_title01 {width: 700px; margin: auto; box-sizing: border-box; border-bottom: 2px solid #000; padding-bottom: 20px; margin-bottom: 20px; font-size: 50px; line-height: 1;}
.page_title02 {font-size: 35px; width: 700px; margin: auto;}






/*
記事詳細ページ
***************/
.navigation .next-entries,.navigation .previous-entries {width: 119px; height: 37px; line-height: 1; font-size: 16px; color: #000; border: 1px solid #000; position: relative; background: url("img/blog/arrow.svg")center left 20px no-repeat;}
.nav_archive_btn {width: 250px; height: 40px; background: url("img/blog/arrow02.svg")center left 60px no-repeat; background-color: #000; font-size: 14px; line-height: 1;}
.navigation .fa {display: none;}

/*ページネーション
*******************/
.paging {
clear: both;
padding: 20px 0;
position: relative;
font-size: 14px;
line-height: 14px;
text-align: center;
}
.paging-box {
display: inline-block;
}
.paging span, .paging a {
display: block;
float: left;
margin: 2px 2px 2px 0;
padding: 10px 15px 10px 15px;
text-decoration: none;
width: auto;
color: #000; /* 文字色 */
background: #ddd; /* 背景色 */
border: 1px solid #bbb;
font-weight: bold;
}
.page-of {display: none !important;}
.paging a:hover{
color: #fff; /* マウスホバー時の文字色 */
background: #ccc; /* マウスホバー時の背景色 */
}
.paging .current{
padding: 10px 15px 10px 15px;
color: #fff; /* 文字色 */
background: #ccc; /* 背景色 */
}
@media only screen and (max-width: 413px) {
.paging {
font-size: 12px;
padding-bottom: 0;
line-height: 12px;
}
.paging span, .paging a {
padding: 8px 10px 8px 10px;
}
.paging .current{
padding: 8px 10px 8px 10px;
}
}
