@charset "utf-8";

/*
Theme Name: kataduke_child
Template: kataduke_child
Author: t-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: 50px 0;}
.indent_content02 {margin-top: 50px;}
.content {padding: 40px; position: relative;}
/******************************
HEADER
******************************/
.nav_bg {background: #1b1b1b; padding: 20px 0;}
.global_nav{display: table; width: 100%;}
.global_nav li {display: table-cell; position: relative; line-height: 1; box-sizing: border-box; font-size: 16px; border-left: 2px solid #fff;}
.global_nav li:last-child {border-right: 2px solid #fff;}
.global_nav a::after {
  position: absolute;
  bottom: -5px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #4ecd00;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
.global_nav a:hover::after {
  transform: scale(1, 1);
}
header {padding: 10px 0 15px;}
header h1 {font-size: 12px; margin-bottom: 15px;}
header .logo {margin-right: 10px;}
header h2 {font-size: 40px; margin-bottom: 5px;}
header .min {font-size: 20px; line-height: 1;}
header .tel_box {font-size: 16px; line-height: 1;}
header .tel {font-size: 38px;}
header .tel img {margin-right: 10px;}
header .mail_box {box-sizing: border-box; border: 2px solid #000; width: 250px; line-height: 1; background: #fff;}
header .over {background: #000; font-size: 16px; line-height: 1; padding: 2px 0;}
header .under {font-size: 16px; padding: 20px 0;}
header .under img {margin-right: 10px;}
.front_main {position: relative; background: url("img/header/main_bg.jpg")center center no-repeat;}
.front_main .main_txt {position: absolute; left: 0; right: 0; bottom: 20px; margin: auto; z-index: 10;}

/*index*/
#index .box01 {background: url("img/index/box01_bg.jpg")top left repeat;}
#index .box01 .gallery_box {box-sizing: border-box; border: 2px solid #000;}
#index .box01 .gallery_box::before {content: ''; position: absolute; background: url("img/index/box01_icon01.png")no-repeat; width: 386px; height: 294px; top: 30px; left: -350px;}
#index .box01 .gallery_box::after {content: ''; position: absolute; background: url("img/index/box01_icon02.png")no-repeat; width: 640px; height: 479px; bottom: 200px; right: -350px;}
#index .box01 h2 {font-size: 50px; line-height: 1.2; background: #1b1b1b; padding: 20px 40px; position: relative; overflow: hidden;}
#index .box01 h2::after {content: ''; position: absolute; background: url("img/index/box01_title_icon.png")no-repeat; width: 591px; height: 164px; right: 0; top: 0; bottom: 0; margin: auto;}
#index .box01 h2 .big {font-size: 60px;}
#index .box01 .t01 {background: #3c9d00; position: relative; z-index: 10; font-size: 60px; display: inline-block; line-height: 1;}
#index .box01 .t02 {background: #fff; position: relative; z-index: 10; color: #3c9d00; font-size: 60px; display: inline-block; line-height: 1;}
#index .box01 .gallery_list {padding: 0 20px 20px; position: relative; z-index: 10; background: #fff;}
#index .box01 .gallery_item {width: 215.2px; margin-top: 20px; margin-right: 20px;}
#index .box01 .gallery_item:nth-child(5n) {margin-right: 0;}
#index .box01 .gallery_img {width: 215.2px; margin-bottom: 10px;}
#index .box01 .gallery_img img {width: 100%; height: 150px; object-fit: cover;}
#index .box01 .price {font-size: 16px; line-height: 1;}
#index .box01 .price span {font-size: 26px; color: #4ecd00;}
#index .box01 .gallery_list h3 {font-size: 14px; line-height: 1.3; margin: 20px auto;}
#index .box01 .btn {background: url("img/index/box01_btn_bg.png")center right 10px no-repeat; background-color: #1b1b1b; line-height: 1; padding: 10px;}
#index .box01 .btn02 {background: url("img/index/box01_btn_bg.png")center right 50px no-repeat; background-color: #000; font-size: 18px; line-height: 1; padding: 20px 0; width: 500px; margin: 50px auto 0;}
#index .box01 .cat_box {background: #fff; padding: 0 20px 20px; position: relative; z-index: 10;}
#index .box01 .cat_box h3 {background: #1b1b1b; font-size: 25px; line-height: 1; padding: 20px 0;}
#index .box01 .cat_box a {box-sizing: border-box; background: #1b1b1b; width: 372px; height: 50px; position: relative; padding: 5px; margin-right: 20px; margin-top: 20px;}
#index .box01 .cat_box a:nth-child(3n) {margin-right: 0;}
#index .box01 .cat_box a::after {content: ''; position: absolute;}
#index .box01 .cat_box a:nth-child(1)::after {background: url("img/index/box01_cat_icon01.png")no-repeat; width: 36px; height: 50px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(2)::after {background: url("img/index/box01_cat_icon02.png")no-repeat; width: 50px; height: 53px; bottom: 0; right: 5px;}
#index .box01 .cat_box a:nth-child(3)::after {background: url("img/index/box01_cat_icon03.png")no-repeat; width: 41px; height: 50px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(4)::after {background: url("img/index/box01_cat_icon04.png")no-repeat; width: 62px; height: 46px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(5)::after {background: url("img/index/box01_cat_icon05.png")no-repeat; width: 50px; height: 50px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(6)::after {background: url("img/index/box01_cat_icon06.png")no-repeat; width: 51px; height: 50px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(7)::after {background: url("img/index/box01_cat_icon07.png")no-repeat; width: 41px; height: 54px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(8)::after {background: url("img/index/box01_cat_icon08.png")no-repeat; width: 64px; height: 51px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(9)::after {background: url("img/index/box01_cat_icon09.png")no-repeat; width: 55px; height: 55px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(10)::after {background: url("img/index/box01_cat_icon10.png")no-repeat; width: 56px; height: 38px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(11)::after {background: url("img/index/box01_cat_icon11.png")no-repeat; width: 48px; height: 50px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(12)::after {background: url("img/index/box01_cat_icon12.png")no-repeat; width: 41px; height: 51px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(13)::after {background: url("img/index/box01_cat_icon13.png")no-repeat; width: 30px; height: 54px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(14)::after {background: url("img/index/box01_cat_icon14.png")no-repeat; width: 50px; height: 45px; bottom: 5px; right: 5px;}
#index .box01 .cat_box a:nth-child(15)::after {background: url("img/index/box01_cat_icon15.png")no-repeat; width: 38px; height: 56px; bottom: 5px; right: 5px;}

#index .box01 .cat_box a p {position: relative; font-size: 20px; z-index: 10; width: 100%; box-sizing: border-box; border-left: 5px solid #3c9d00;}



#index .box02 {background: url("img/index/box02_bg.jpg")center center no-repeat; padding: 50px 0 100px; box-sizing: border-box; border-top: 5px solid #a0a0a0; border-bottom: 5px solid #a0a0a0;}
#index .box02 h2 {font-size: 45px; line-height: 1.2; margin-bottom: 40px;}
#index .box02 h2 span {font-size: 55px;}
#index .box02 .green {color: #4ecd00;}
#index .box02 .txt_box {position: relative; margin-right: -290px; z-index: 10;}
#index .box02 .img {position: relative;}
#index .box02 .txt01 {margin-left: 20px;}
#index .box02 .txt02 {font-size: 16px; width: 420px; margin-top: 40px; margin-right: 20px;}
#index .box02 .btn {background: url("img/index/box02_btn_bg.png")center right 20px no-repeat; background-color: #fff; line-height: 1; font-size: 18px; padding: 20px 0; width: 600px; margin: 50px auto 0; box-sizing: border-box; box-shadow: 0 5px #434343;}
#index .box03 {background: url("img/index/box03_bg.jpg")top center no-repeat; overflow: hidden;}
#index .box03 h2 {font-size: 40px; line-height: 1.2; margin-bottom: 30px;}
#index .box03 h2 span {font-size: 70px;}
#index .box03 ul li:nth-child(2) {margin: 0 60px;}
#index .box03 .txt {background: #fff; box-sizing: border-box; border: 2px solid #a0a0a0; padding: 0 30px 15px; font-size: 40px;}
#index .box03 .txt:after {content: ''; position: absolute; background: url("img/index/box03_man.png")no-repeat; width: 206px; height: 299px; right: 10px; top: -5px;}
#index .box03 .btn {background: url("img/index/box01_btn_bg.png")center right 20px no-repeat; background-color: #4ecd00; width: 400px; line-height: 1; font-size: 18px; padding: 20px 0; box-sizing: border-box; box-shadow: 0 2px #434343; margin: 50px auto 0;}
#index .box04 {background: url("img/index/box04_bg.jpg")center center no-repeat;}
#index .box04 .inbox {box-sizing: border-box; line-height: 1; border: 3px solid #1b1b1b; background: #fff; padding: 20px;}
#index .box04 .over {box-sizing: border-box; border-bottom: 2px solid #1b1b1b; padding-bottom: 20px;}
#index .box04 .txt_box { margin: 0 20px 0 10px; font-size: 18px;}
#index .box04 .big {font-size: 35px;}
#index .box04 h2 {font-size: 25px; margin-bottom: 5px;}
#index .box04 .inner {margin: 15px auto 5px; padding-right: 45px;}
#index .box04 .tel {font-size: 40px;}
#index .box04 .tel span {font-size: 65px;}
#index .box04 .mail {box-sizing: border-box; width: 328px; height: 55px; font-size: 16px; background: linear-gradient(#fff, #d7d7d7); box-shadow: 0 3px #434343; border: 1px solid #000; margin-top: -11px;}
#index .box04 .mail img {margin-right: 20px;}
#index .box04 .txt01 {display: inline-block; box-sizing: border-box; border: 3px solid #1b1b1b; background: #fff; font-size: 25px; padding: 5px;}
#index .box04 .txt02 {font-size: 20px; margin-top: 20px;}
#index .box04 .txt03 {margin-top: 10px;}
#index .box05 {background: url("img/index/box05_bg.jpg")top left repeat; padding-bottom: 250px;}
#index .box05 .big {font-size: 80px; line-height: 1; margin-bottom: 40px; z-index: 10;}
#index .box05 .big::after {content: ''; position: absolute; background: url("img/index/box05_man.png") no-repeat; width: 247px; height: 257px; bottom: -40px; right: 30px;}
#index .box05 h2 {box-sizing: border-box; background: #000; border-left: 10px solid #4ecd00; border-right: 10px solid #4ecd00; font-size: 45px; padding: 10px 0; z-index: 10;}
#index .box05 .t01 {background: #3c9d00; position: relative; z-index: 10; display: inline-block;}
#index .box05 .t02 {background: #fff; position: relative; z-index: 10; display: inline-block; color: #3c9d00;}
#index .box05 .list::before {content: ''; position: absolute; background: url("img/index/box05_bg01.png")no-repeat; width: 831px; height: 754px; left: -400px; top: -200px;}
#index .box05 .list::after {content: ''; position: absolute; background: url("img/index/box05_bg02.png")no-repeat; width: 831px; height: 754px; right: -500px; bottom: -100px;}
#index .box05 .list a {width: 386px; margin-right: 20px; margin-top: 20px; position: relative; z-index: 10;}
#index .box05 .list a:nth-child(3n) {margin-right: 0;}
#index .box05 .no {position: absolute; top: -15px; left: -5px; box-sizing: border-box; width: 48px; height: 48px; background: #4ecd00; font-size: 30px; line-height: 1; border-radius: 48px; z-index: 10;}
#index .box05 .txt {position: absolute; top: 0; bottom: 0; left: 30px; font-size: 40px; line-height: 1.2;}
#index .box05 .txt02 {font-size: 30px;}
#index .box05 a:hover img {filter: alpha(opacity=100); opacity: 1;}
#index .box05 .icon01 {position: absolute; left: -350px; top: 20px;}
#index .box05 .icon02 {position: absolute; right: -250px; top: 60px;}
#index .box06 {background: url("img/index/box06_bg.png")top center no-repeat; padding-top: 100px; margin-top: -100px;}
#index .box06 h2 {font-size: 60px; line-height: 1.2; margin: 20px 0 30px;}
#index .box06 h2 span {font-size: 70px;}
#index .box06 h3 {font-size: 18px; margin: 20px auto;}
#index .box06 .inner .box {width: 270px; background: #fff; box-sizing: border-box; border: 2px solid #fff;}
#index .box06 .inner .box p {font-size: 14px; padding: 6px;}
#index .box06 .btn {box-sizing: border-box; background: url("img/index/box02_btn_bg.png")center right 20px no-repeat; background-color: #fff; width: 400px; padding: 20px 0; line-height: 1; font-size: 18px; margin: 50px auto 0;}
#index .box06 a:hover img {filter: alpha(opacity=100); opacity: 1;}
#index .box07 {background: #f6f2ef; padding: 50px 0 25px;}
#index .box07 .list {width: 590px; position: relative;}
#index .box07 .box {background: #fff; padding: 20px; margin-top: 20px;}
#index .box07 h2 {font-size: 30px; box-sizing: border-box; border-left: 5px solid #000; padding-left: 15px;}
#index .box07 .blog_item {box-sizing: border-box; border-bottom: 1px dotted #a5a5a5; font-size: 14px; padding: 15px 0;}
#index .box07 .blog_item:first-child {padding-top: 0;}
#index .box07 .time {font-size: 16px; line-height: 1; color: #4ecd00; margin-right: 20px;}
#index .box07 h3 {font-size: 16px; margin-bottom: 10px; color: #4ecd00;}
#index .box07 .btn {box-sizing: border-box; background: #4ecd00; width: 160px; height: 35px; font-size: 14px; line-height: 1; position: absolute; right: 0; top: 0;}
#index .box07 .list:nth-child(2) .time {color: #3c9d00;}
#index .box07 .list:nth-child(2) h3 {color: #3c9d00;}
#index .box07 .list:nth-child(2) .btn {background: #3c9d00;}
#index .box08 {padding: 25px 0; background: #d2d2d2;}
#index .box08 a {box-sizing: border-box; background: #fff; font-size: 16px; line-height: 1; width: 285px;}
#index .box09 {background: url("img/index/box09_bg.jpg")center center no-repeat; background-size: cover;}
#index .box09 h2 {font-size: 30px; margin-bottom: 20px;}
#index .box09 h2 span {font-size: 50px; margin-right: 20px;}
#index .box09 p {font-size: 16px; box-sizing: border-box; border-top: 2px solid #fff; border-bottom: 2px solid #fff; padding: 10px 0;}
#index .box10 {background: url("img/index/box10_bg.jpg")top left repeat;}
#index .box10 h2 {font-size: 40px;}
#index .box10 h3 {font-size: 30px; box-sizing: border-box; border-left: 5px solid #000; padding-left: 15px; margin-bottom: 20px;}
#index .box10 .bdr {content: ''; background: #4ecd00; width: 150px; height: 2px; margin: 20px auto 40px; position: relative;}
#index .box10 .bdr::before {content: ''; position: absolute; background: #3c9d00; width: 50px; height: 2px; left: 0; right: 0; margin: auto; top: 0;}
#index .box10 h4 {font-size: 18px; line-height: 1.3;}
#index .box10 .questionbox {margin-top: 40px;}
#acMenu dt{
width:575px;
line-height:1;
border-bottom:#000 1px solid;
cursor:pointer;
padding: 10px 80px 10px 10px;
box-sizing: border-box;
font-weight: bold;
position: relative;
}
#acMenu .bdr01{position: absolute; content: ''; background: #000; top: 0 ;bottom: 0; right: 20px; z-index: 10; width: 20px; height: 5px; margin: auto;}
#acMenu .bdr02{position: absolute; content: ''; background: #000; top: 0 ;bottom: 0; right: 27.5px; z-index: 10; width: 5px; height: 20px; margin: auto;}
#acMenu .bdr02{opacity: 1;transform: translateY(0);transition-duration: .5s; transition-timing-function: Linear Out, Slow In;}
#acMenu dt.active .bdr02{opacity: 0;transform: translateY(10px);}
#acMenu dt img,#acMenu dd img {margin-right: 20px;}
#acMenu dd{
width:575px;
line-height:1.5;
box-sizing: border-box;
display:none;
padding: 10px;
background: #fff;
}
#acMenu #acMenu:nth-of-type(1) dt {border-top: 1px solid #000;}



/*========================
FOOTER
========================*/
footer .over {background: url("img/footer/footer_bg.jpg")top center no-repeat; padding: 50px 0; line-height: 1; background-size: cover;}
footer .home_link {font-size: 16px; line-height: 1; margin-bottom: 40px;}
footer .inner {line-height: 1;}
footer .inner li {font-size: 17px; margin-top: 15px; color: #fff;}
footer .inner02 ul:first-child {margin-right: 50px;}
footer .txt {font-size: 18px; margin-top: 20px;}
footer .list ul {margin-right: 15px;}
footer .right_box {padding: 20px; box-sizing: border-box; width: 424px; background: #eee; border-bottom: 5px solid #3c9d00; position: relative;}
footer .right_box .title {font-size: 16px; position: relative; z-index: 10;}
footer .right_box .big {font-size: 25px; margin-bottom: 5px;}
footer .right_box .min {font-size: 14px;}
footer .txt_box {font-size: 16px; margin: 15px auto; position: relative; z-index: 10;}
footer .txt_box p {margin-top: 5px;}
footer .right_box .tel {font-size: 20px;}
footer .right_box .tel span {font-size: 40px;}
footer .right_box .mail {box-sizing: border-box; background: linear-gradient(#fff, #d7d7d7); width: 328px; height: 55px; box-shadow: 0 3px #434343; font-size: 16px; margin: 15px auto 0;}
footer .right_box .mail img {margin-right: 10px;}
footer .logo {position: absolute; left: 5px; top: 0;}
footer .inner .mgn-t0 {margin-top: 0}
footer .copyright {background-color: #000; padding: 10px 0; font-size: 12px;}
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; box-sizing: border-box; border: 1px solid #000; background-color: #fff;}
#pop_banner .icon01 {box-sizing: border-box; border-right: 1px solid #fff;-webkit-transition: all 0.5s ease; background-color: #000;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all  0.5s ease;}
#pop_banner .icon01:hover {
  background-color: #4ecd00;
  -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 .icon01:hover img {opacity: 1;}


/*pankuzu*/
.pan {padding: 20px 0;}
.pan p {font-weight: bold; margin: 0 auto;}
.pan a {display: inline;}
/*========================
ページ設定
========================*/
/*
サムネ
*************/
.page_thumb {
width: 100%;
margin: auto;
box-sizing: border-box; 
background: url(img/thumb_bg.jpg)center center no-repeat;
height: 270px;
color: #fff;
font-size: 32px;
line-height: 1;
}
.thumb02 {background: url(img/thumb_bg02.jpg)center center no-repeat;} 
.thumb03 {background: url(img/thumb_bg03.jpg)center center no-repeat;} 
.thumb04 {background: url(img/thumb_bg04.jpg)center center no-repeat;} 
.thumb05 {background: url(img/thumb_bg05.jpg)center center no-repeat;} 
.thumb06 {background: url(img/thumb_bg06.jpg)center center no-repeat;} 
.thumb07 {background: url(img/thumb_bg07.jpg)center center no-repeat;} 
.thumb08 {background: url(img/thumb_bg08.jpg)center center no-repeat;} 
.thumb09 {background: url(img/thumb_bg09.jpg)center center no-repeat;} 
.thumb10 {background: url(img/thumb_bg10.jpg)center center no-repeat;} 
.thumb11 {background: url(img/thumb_bg11.jpg)center center no-repeat;} 
.thumb12 {background: url(img/thumb_bg12.jpg)center center no-repeat;} 

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

/*
タイトル
*************/
.page_title {
font-size: 22px;
line-height: 1;
background: #3c9d00; padding: 10px 5px;
color: #fff;
box-sizing: border-box;
margin-bottom: 20px;
}
.page_title span {box-sizing: border-box; border-left: 5px solid #fff; padding-left: 5px;}


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

.previous-entries,.next-entries {
color: #fff;
width: 80px;
background: #262626;
padding: 6px 0 0 10px;
box-sizing: border-box;
font-weight: bold;}
.next-entries {background: #262626;}

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

.nav_archive_btn {
color: #fff;
font-weight: bold;
width: 150px;
background: #262626;
padding: 6px 0 6px 10px;
box-sizing: border-box;
}
.navigation {margin-bottom: 40px;}

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