@charset "utf-8";
/*
Theme Name: km_child
Template: km_child
Author: t-labo
Author URI: https://takai-laboratory.com/
*/

/*========================*/
.mincho { font-family: 'Noto Serif Japanese', serif; }

main { overflow: hidden; }
/*****************
width-768px以下
*****************/

.mgn-r20 {
	margin-right: 20px;
}
/*fade
***************/
/* 画面外にいる状態 */
.fadein {
    opacity : 0;
    transform : translate(0, 150px);
    transition : all 1500ms;
}
 
/* 画面内に入った状態 */
.fadein.scrollin {
    opacity : 1;
    transform : translate(0, 0);
}


/******************************
HEADER
******************************/
header {background-color: #fff;}
header .over {background-color: #2b2b2b; padding: 5px 0; color: #fff;}
header h1 {font-size: 13px; color: #fff;}
header h2 {font-size: 35px;}
header .center {font-size: 16px; line-height: 1.2; padding: 20px 0;}
header .ul01 {display: flex; justify-content: space-between; align-items: center; width: 170px;}
header .ul_bg {background-color: #910000;}
.main_nav {font-size: 16px; padding: 10px 0; line-height: 1;}
.main_nav li:nth-child(1) {box-sizing: border-box; border-left: 2px solid #fff;}
.main_nav li {padding: 5px 0; box-sizing: border-box; border-right: 2px solid #fff; width: 100%;}
.indent_content {padding: 40px 0; position: relative;}
.indent_content02 {margin-top: 20px;}
.content {padding: 20px; position: relative;}
.main {min-width: 1920px; position: relative; margin-left: -960px; left: 50%;}


/*========================
index
========================*/
#index .n_box01 {background: url("img/index/n_box01_bg.jpg")center center no-repeat; padding: 80px 0;}
#index .n_box01 h2 {position: relative; background: #e60010; height: 70px; font-size: 50px; font-weight: 900; z-index: 10;}
#index .n_box01 h2::before,#index .n_box01 h2::after {content: ''; position: absolute; background: #000; top: 0; bottom: 0; margin: auto; width: 41px; height: 100%;}
#index .n_box01 h2::before {left: 0; clip-path: polygon(0 0,100% 50%,0 100%);}
#index .n_box01 h2::after {right: 0; clip-path: polygon(0 50%,100% 0,100% 100%);}
#index .n_box01 .inner {margin: 70px auto 45px;}
#index .n_box01 .icon {position: absolute; left: -70px; top: 0; bottom: 0; margin: auto;}
#index .n_box01 .text {position: relative; z-index: 10; margin-left: auto;}
#index .n_box01 .btn {box-sizing: border-box; background: #fff; width: 500px; height: 60px; font-size: 16px; line-height: 1; border: 3px solid #000; position: relative; margin: auto;}
#index .n_box01 .btn::after {content: ''; position: absolute; background: #000; width: 100%; height: 3px; bottom: -3px; left: 0;}


#index .box01 {background: url(img/index/box01_bg.jpg)top left repeat; padding-bottom: 40px;}
#index .box01 h2 {background-color: #161616; font-size: 60px; padding: 10px 0; box-sizing: border-box; border-bottom: 4px solid #878787;}
#index .box01 .big {font-size: 35px; line-height: 1.3; margin-top: 30px;}
#index .box01 .big span {font-size: 43px}
#index .box01 .arrow {margin-top: -4px;}
#index .box01 .txt_box {position: relative; box-sizing: border-box; border: 4px solid #000; background-color: #fff; box-shadow: 3px 3px #000; font-size: 16px; padding: 15px 20px; margin-top: 20px;}
#index .box01 .icon {position: absolute; left: -130px; top: -95px;}
#index .box01 .txtpoint {background-image: radial-gradient(.10em .10em at center center,red,red 100%,transparent); background-position: top left -10px;}
#index .box02 {background: url(img/index/box02_bg.png)center bottom no-repeat; padding-bottom: 40px;}
#index .box02 .title {background: url(img/index/box02_bg.jpg)top left repeat; padding: 40px 0;}
#index .box02 .txt_box {background: url(img/index/box02_txt_bg.jpg)top right repeat; box-sizing: border-box; border: 3px solid #000; box-shadow: 3px 3px #000; font-size: 20px; line-height: 1.2; margin-top: 40px;}
#index .box02 .txt_box .img01 {box-sizing: border-box; border-left: 30px solid #ff0000;}
#index .box02 .txt_box .img02 {box-sizing: border-box; border-right: 30px solid #ff0000;}
#index .box02 .txt_box .big {font-size: 35px; margin-top: 10px;}
#index .box03 {background: url(img/index/box03_bg.jpg)center center no-repeat; padding: 60px 0;}
#index .box03 .txt01 {position: relative; z-index: 10;}
#index .box03 .icon01 {position: absolute; left: 50px; top: -310px;}
#index .box03 .icon02 {position: absolute; right: 40px; bottom: 5px;}
#index .box04 {background: url(img/index/box04_bg.jpg)top left repeat;}
#index .box04 .icon01 {position: absolute; left: -50px; top: -10px;}
#index .box04 .icon02 {position: absolute; right: 20px; top: -30px;}
.swiper-custom-parent {position: relative; overflow: hidden; width: 1100px; margin: 30px auto 0; padding: 4px 0;}
.swiper-container {width: 1000px; box-sizing: border-box; border: 3px solid #000; box-shadow: 4px 4px #6f6b6c;}
.swiper-button-prev {top: 0!important; bottom: 0; left: 0!important; margin: auto!important; width: 23px!important; height: 40px!important;}
.swiper-button-next {top: 0!important; bottom: 0; right: 0!important; margin: auto!important; width: 23px!important; height: 40px!important;}
.swiper-button-prev:after,.swiper-button-next:after {display: none;}
#index .box05 {background: url(img/index/box05_bg.jpg)top left repeat;}
#index .box05 .title_area {font-size: 20px; line-height: 1.2; background-color: #000; padding: 15px 15px 15px 0; position: relative;}
#index .box05 .title_area .icon {position: absolute; left: -20px; bottom: 5px;}
#index .box05 h2 {font-size: 45px; margin-right: 15px; line-height: 1;}
#index .box05 .box {box-sizing: border-box; border: 3px solid #000; background: url(img/index/box05_bg02.jpg)top left repeat;}
#index .box05 .tel {position: relative; background-color: #d60000; box-sizing: border-box; border: 2px solid #000; border-left: 20px solid #000; border-right: 20px solid #000; line-height: 1; padding: 10px 0 5px;}
#index .box05 .tel .big {font-size: 60px; margin-top: 5px;}
#index .box05 .tel .big img {margin-right: 10px;}
#index .box05 .tel .icon01 {position: absolute; left: 0; bottom: 0;}
#index .box05 .tel .icon02 {position: absolute; right: 0; top: 0;}
#index .box05 .big_txt {font-size: 30px; line-height: 1; margin: 20px auto 10px;}
#index .box05 table {width: 100%;}
#index .box05 th,#index .box05 td {padding: 10px; box-sizing: border-box; font-size: 20px;}
#index .box05 th{font-weight: bold; vertical-align: middle; width: 250px;}
#index .box05 input,#index .box05 textarea {width: 100%; box-sizing: border-box; padding: 3px; font-size: 18px; font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Arial, Meiryo, sans-serif; font-weight: bold;}
.mwform-radio-field input,.mwform-checkbox-field input {width: auto!important; padding: inherit!important;}
.mwform-checkbox-field label {font-weight: bold!important;}
.mwform-radio-field-text {font-weight: bold;}
#contact table .tel_area {width: auto;}
/*確認画面へ進むボタン用*/
.mw_wp_form_input .btn input:hover,
.mw_wp_form_confirm .btn input:hover { opacity: 0.7; }
.mw_wp_form_input .btn input{
	background-color: #161616;
    font-size: 18px;
    width: 430px!important;
    padding: 16px 0!important;
    line-height: 1;
	color: #fff;
	font-weight: bold;
	border: none;
}
/*送信ボタン用*/
.mw_wp_form_confirm .btn input{
	background-color: #161616;
    font-size: 18px;
    width: 430px!important;
    padding: 16px 0!important;
    line-height: 1;
	color: #fff;
	border: none;
}
#index .box06 {background: url(img/index/box06_bg.jpg)top left repeat;}
.tab-panel {width: 1100px; margin: 0 auto;}
.tab,.tab02{
    list-style:none;
    cursor:pointer;
}
.panel-group{
    box-sizing: border-box;
	border: 5px solid #000;
	background-color: #fff;
	padding: 35px;
	border-radius: 20px;
	font-size: 18px;
	margin-top: 50px;
	box-shadow: 5px 5px #a3a0a1;
}
.panel,.panel02{
    display:none;
}
.tab.is-active,.tab02.is-active02{
    background:#F00;
    color:#FFF;
    transition: all 0.2s ease-out;
}
.panel.is-show,.panel02.is-show02{
    display:block;
}
#index .box06 ul {margin-top: 50px;}
#index .box06 li {box-sizing: border-box; border: 5px solid #161616; background-color: #fff; width: 345px; position: relative; box-shadow: 5px 5px #a3a0a1;}
#index .box06 li .title_area {box-sizing: border-box; border-bottom: 5px solid #000;}
#index .box06 li .txt {color: #000; padding: 20px 30px; font-size: 18px;}
#index .box06 h3 {color: #000; font-size: 20px; line-height: 1.2;}
#index .box06 .btn p {box-sizing: border-box; border-bottom: 2px solid #fff;}
#index .box06 .icon {margin-left: -5px; margin-top: -20px;}
#index .box06 .btn {background-color: #000; font-size: 16px; padding: 15px 10px;}
.panel-group .big {font-size: 30px; line-height: 1;}
.panel-group img {margin-right: 30px;}
.panel-group .txt01 {font-size: 22px; line-height: 1; margin: 25px 0 10px;}
#index .box06 .tab-D {margin-right: 32.5px;} 


#index .box07 {background: url(img/index/box07_bg.jpg)top left repeat;}
#index .box07 h2 {position: relative; z-index: 10; margin-top: 30px;}
#index .box07 .icon01 {position: absolute; left: -40px; top: 0;}
#index .box07 .icon02 {position: absolute; right: 20px; top: 0;}
#index .box07 .con01 {box-sizing: border-box; border: 5px solid #000; background-color: #fff; box-shadow: 5px 5px #a8a5a7; padding: 25px; font-size: 18px; padding-top: 20px; margin-top: 60px;}
#index .box07 .title_area {font-size: 20px; line-height: 1; margin-bottom: 15px;}
#index .box07 .title_area img {margin-right: 20px;}
#index .box07 h3 {font-size: 30px; margin-bottom: 10px;}
#index .box07 .icon03 {position: absolute; top: -33px; left: -25px; width: 300px; padding: 10px 0; font-size: 30px; background-color: #d60000; box-sizing: border-box; border: 5px solid #000; line-height: 1;}
#index .bnr_area {background: url(img/index/box02_bg.jpg)top left repeat; padding: 40px 0;}
#index .box08 {background: url(img/index/box08_bg.jpg)top left repeat;}
#index .box08 h2 {margin-bottom: 40px;}
#acMenu dt{
display:flex;
justify-content: flex-start; align-items: center;
width:100%;
line-height:1;
border:#000 2px solid;
cursor:pointer;
padding: 15px;
box-sizing: border-box;
font-weight: bold;
border-top: none;
font-size: 25px;
background:url("img/index/box08_bg01.png") no-repeat;
background-position: center right 20px;
border-left: none;
border-right: none;
}
#acMenu dt img,#acMenu dd img {margin-right: 20px;}
#acMenu dd{
width:100%;
line-height:1.5;
border:#000 2px solid;
display:none;
padding: 15px;
border-top: none;
box-sizing: border-box;
font-size: 16px;
border-left: none;
border-right: none;
}
#acMenu dd span {display: flex; justify-content: flex-start; align-items: center;}
#acMenu dt:nth-child(1) {border-top: 2px solid #000;}
#acMenu dt.active{background:url("img/index/box08_bg02.jpg") no-repeat; background-position: center right 20px;}
#index .box09 {background: url(img/index/box09_bg.jpg)top left repeat;}
#index .box09 .inner {margin-top: 30px;}
#index .box09 h2 {font-size: 40px; margin-bottom: 10px;}
#index .box09 .min {font-size: 25px; line-height: 1;}
#index iframe {width: 540px; height: 320px; box-sizing: border-box; border: 2px solid #000;}
#index .box09 li {font-size: 20px; box-sizing: border-box; border-bottom: 2px solid #000; padding: 8px 0;}
#index .box09 li:nth-child(1) {padding-top: 0;}
#index .box09 li span {font-size: 25px;}
#index .box09 ul {width: 415px;}
.end_txt {padding: 0 20px 20px;}


/*========================
FOOTER
========================*/
footer .over {background: url(img/footer/bg.jpg)top center no-repeat; padding: 40px 0 30px;}

footer .copyright_area {display: flex; justify-content: center; align-items: center; font-size: 12px; padding: 5px 0; background-color: #161616; color: #fff;}

/*pankuzu*/
.pan {padding: 20px 0;}
.pan p {font-weight: bold; margin: 0 auto;}
.pan a {display: inline;}

#pop_banner .inner 
{display: flex; justify-content: space-between; align-items: center; background-color: #fff; box-sizing: border-box; border: 3px solid #000;
width: 800px;
	margin: auto;
	position: fixed;
	bottom: 20px;
	left: 0;
	right: 0;
	z-index: 100;}
#pop_banner .icon01 {box-sizing: border-box; box-shadow: 2px 2px #6e686b; margin-right: 10px;}
#pop_banner .icon02 {border-left: 3px solid #000;}
#pop_banner .right_area {display: flex; align-items: center; justify-content: center;}
/*========================
ページ設定
========================*/
/*
サムネ
*************/
.page_thumb {
	width: 100%;
	margin: auto;
	box-sizing: border-box; 
	background: url(img/thumb_bg.jpg);
	height: 270px;
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 32px;
	letter-spacing: 5px;
}
/*****************
width480px以下
*****************/
@media screen and (max-width:480px) {
.page_thumb img {
	height: 120px;
}
}

/*
タイトル
*************/
.page_title {
	background-color: #2b2b2b;
	text-align: left;
	padding-left: 10px;
	box-sizing: border-box;
	font-weight: bold;
	font-size: 22px;
	color: #fff;
}
.page_title span {border-left: 5px solid #fff; padding-left: 10px;}
/*
wrap
*************/
.single_page {
	width: 100%;
	max-width: 715px;
	margin-bottom: 40px;
}
.sidebar {width: 24.5%; max-width: 245px; margin-bottom: 40px;}

/*****************
width768px以下
*****************/
@media screen and (max-width:768px) {
.single_page {
	width: 100%;
	margin: auto;
}
	.sidebar {display: none;}
}

/*
記事詳細ページ
***************/

.previous-entries,.next-entries {
	color: #000;
    width: 80px;
    background: #ddd;
    padding: 6px 0 0 10px;
    border: 2px solid #bbb; 
    box-sizing: border-box;
	font-weight: bold;}

.gallery_entry {
	display: inline-block;
	vertical-align: middle;
	width: 12px;
	height: 20px;
	margin: 0 10% 3px;
}

.nav_archive_btn {
	color: #000;
	font-weight: bold;
	width: 150px;
	background: #DCDCDC;
	padding: 6px 0 6px 10px;
	box-sizing: border-box;
	border: 2px solid #bbb;
}


/*ページネーション
*******************/
.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;
}
}