@charset "utf-8";

/*
Theme Name: ai_child
Template: ai_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;}

/******************************
HEADER
******************************/
header .inner {margin-top: 5px;}
.front_main_area h1 {min-width: 283px;}
.global_nav {display: table; width: 850px;}
.global_nav li {display: table-cell; position: relative; line-height: 1.3; box-sizing: border-box; font-size: 14px; border-right: 1px solid #000;}
.global_nav li:last-child {border-right: none;}
.global_nav li span {font-size: 18px;}
.global_nav a::after {
  position: absolute;
  bottom: -5px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #000;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
.global_nav a:hover::after {
  transform: scale(1, 1);
}
.global_nav02 {padding: 20px 0;}
.global_nav02 .global_nav {margin-bottom: 0;}
.insta_icon02 {width: 30px;}
.lower_logo {min-width: 283px;}
.indent_content {padding: 100px 0;}
.indent_content02 {margin-top: 50px;}
.content {padding: 20px; position: relative;}
.front_main .slider-wrapper {height: 100%;}
.front_main_area {position: relative;}
.front_main_area .main_box {width: 1200px; margin: 0 auto; position: absolute; bottom: 50px; left: 0; right: 0; z-index: 20;}
.front_main_area .main_box .logo {padding-bottom: 30px;}
.front_main {width: 100%;
height: 98%;
height: -webkit-calc(100% - 145px);
height: calc(100% - 145px);
position: relative;
}
.front_main .swiper-container {
	width: 1920px; height: 100%;
}
.front_main .swiper-slide img {width: 100%; height: 100%; object-fit: cover;}
.front_main .swiper-slide-active img {
animation: kf-slide-img 5s linear infinite 1s;
}
@-webkit-keyframes kf-slide-img {
  0% {
transform: scale(1);
  }
  100% {
transform: scale(1.05);
  }
}

.front_news_item {background-color: #fff; font-size: 16px; width: 550px; margin-left: auto; padding: 15px 0; border-radius: 22.5px; line-height: 1;}
.front_news_item .time {padding: 0 10px; margin-right: 10px; box-sizing: border-box; border-right: 1px solid #000;}
.front_main_area .inner {margin-top: -75px; position: relative; z-index: 10;}


/*index*/
#index .btn {background: url("img/index/btn_bg.png")center right 10px no-repeat; background-color: #fff; box-sizing: border-box; border: 1px solid #f19cc1; border-radius: 25px; font-size: 18px; line-height: 1; padding: 15px 0; width: 400px; margin: 100px auto 0;}
#index .box01 {padding: 160px 0; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl;}
#index .box01 h2 {font-size: 35px; line-height: 1.8; white-space: nowrap; margin-left: 130px;}
#index .box01 .txt01 {font-size: 16px; line-height: 2.5; margin: auto 50px auto 0; height: 450px; -webkit-transition-delay: .6s; transition-delay: .6s;}
#index .box01 .txt02 {margin-top: 170px; margin-right: 80px; -webkit-transition-delay: 1.2s; transition-delay: 1.2s;}
#index .box01 .txt02 span {font-size: 22px;}
#index .box01 .icon01 {position: absolute; right: -750px; top: 0; -webkit-transition-delay: 1.5s; transition-delay: 1.5s;}
#index .box01 .icon02 {position: absolute; left: -650px; bottom: 0; -webkit-transition-delay: 2s; transition-delay: 2s;}
#index .add-box01 {padding-bottom: 160px;}
#index .animate_bg {opacity: 0; -webkit-transform: translateY(10%); transform: translateY(10%); transition-duration: 1s; transition-timing-function: cubic-bezier(0.01, 0.84, 1, 0.99);}
#index .animate_bg02 {opacity: 0; -webkit-transform: translateY(-10%); transform: translateY(-10%); transition-duration: 1s; transition-timing-function: cubic-bezier(0.01, 0.84, 1, 0.99);}
#index .animate_text {opacity: 0; -webkit-transform: translateY(-10%); transform: translateY(-10%); transition-duration: .7s; transition-timing-function: cubic-bezier(0.01, 0.84, 1, 0.99);}
#index .box01 .inview  {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);}
#index .box02 {background: url("img/index/box02_bg.jpg")bottom 50px center no-repeat;}
#index .box02 .big {font-size: 30px; line-height: 1;}
#index .box02 .big span {font-size: 40px;}
#index .box02 h2 {font-size: 18px; margin: 25px auto 100px;}
#index .box02 ul {position: relative;}
#index .box02 ul::before {content: ''; position: absolute; left: -50px; bottom: -50px; background: url("img/index/box02_bg_icon.png")no-repeat; width: 284px; height: 141px;}
#index .box02 li {box-sizing: border-box; border: 3px solid #e5e5e5; background-color: #fff; width: 265px; position: relative; line-height: 2;}
#index .box02 li:nth-child(2) {margin: 0 30px;}
#index .box02 li:nth-child(3) {margin-right: 30px;}
#index .box02 h3 {font-size: 18px; line-height: 1.3;}
#index .box02 .txt01 {line-height: 1; margin: 10px auto 20px;}
#index .box02 .txt0101 {margin-bottom: 0;}
#index .box02 .txt_box {padding: 20px 0 15px;}
#index .box02 .icon {position: absolute; top: -20px; left: -20px;}
#index .box03 .big {font-size: 40px; position: relative; line-height: 1;}
#index .box03 h2 {font-size: 18px;  margin: 25px auto 45px;}
#index .box03 ul::after {content: ''; position: absolute; background: url("img/index/box03_bg_icon.png")no-repeat; width: 250px; height: 294px; right: -260px; bottom: -100px;}
#index .box03 li {width: 224px;}
#index .box03 .txt01 {
position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; font-size: 20px;
display: inline; width: max-content; height: max-content; z-index: 10; opacity: 0; transition: all .5s ease 0s; 
}
#index .box03 .shadow {position: absolute; line-height: 1; width: 100%; height: 100%; content: ""; top: 0; left: 0; background-color: rgba(255,255,255,.7); opacity: 0; transition: all .5s ease 0s;}
#index .box03 li:hover .shadow {opacity: 1;}
#index .box03 li:hover .txt01 {opacity: 1;}
#index .box03 .over {background:transparent;position:relative;display:inline-block;transition:all 0.3s ease-in-out;text-align:center; margin: 15px auto 10px;}
#index .box03 .over:before, #index .box03 .over:after {content:'';display:block;position:absolute;box-sizing:border-box;border-style:dotted;width:1em;height:1em;transition:all 0.3s ease-in-out}
#index .box03 .over:before {top:5px;left:5px;border-width:2px 0 0 2px;z-index:5;}
#index .box03 .over:after {bottom:5px;right:5px;border-width:0 2px 2px 0;}
#index .box03 .over:before, #index .box03 .over:after {border-color:transparent;}
#index .box03 .over:hover:before, #index .box03 .over:hover:after {width:calc(100% - 10px); height:calc(100% - 10px);border-color:#f19cc1}
#index .box03 .gel1 {position: absolute; left: 60px; top: -70px; transform: scaleX(.8) scaleY(1.2) translateY(10%); opacity: 0; transition-duration: 1s;}
#index .box03 .gel2 {position: absolute; left: 110px; top: -30px; transform: scaleX(.8) scaleY(1.2) translateY(10%); opacity: 0; transition-duration: 1s; transition-delay: .2s}
#index .box03 .gel3 {position: absolute; right: 100px; top: -60px; transform: scaleX(.8) scaleY(1.2) translateY(10%); opacity: 0; transition-duration: 1s;transition-delay: .4s}
#index .box02 a:hover img,#index .box03 a:hover img {
	filter: alpha(opacity=100);
	opacity: 1;
}
#index .box04 .big {font-size: 40px; line-height: 1;}
#index .box04 h2 {font-size: 18px; margin: 20px auto 100px;}
#index .box04 .box_area::before {content: ''; position: absolute; background: url("img/index/box04_bg_icon.png")no-repeat; width: 150px; height: 142px; top: -200px; left: 200px;}
#index .box04 .box {background: url("img/index/box04_box_bg.jpg")top center no-repeat; box-sizing: border-box; border: 2px solid #f19cc1; border-radius: 40px 40px 20px 20px; line-height: 1; overflow: hidden; position: relative; z-index: 10;}
#index .box04 .over {padding: 35px 30px;}
#index .box04 .over p {font-size: 25px; margin-left: 20px; line-height: 1.5;}
#index .box04 .img {position: absolute; right: 10px; top: -67px; z-index: 20;}
#index .box04 .under {background: url("img/index/box04_under_icon.png")center right 30px no-repeat; background-color: #f19cc1; padding: 10px 0; font-size: 18px; position: relative; z-index: 10;}
#index .box04 .icon01 {position: absolute; top: -70px; left: -90px;}
#index .box04 .icon02 {position: absolute; top: -190px; right: 80px;}
#index .box04 .icon03 {position: absolute; bottom: -50px; right: -210px;}
#index .box04_gel1 {position: absolute; transform: scaleX(.8) scaleY(1.2) translateY(10%); opacity: 0; transition-duration: 1s;}
#index .box04_gel2 {position: absolute; transform: scaleX(.8) scaleY(1.2) translateY(10%); opacity: 0; transition-duration: 1s; transition-delay: .2s}
#index .box04_gel3 {position: absolute; transform: scaleX(.8) scaleY(1.2) translateY(10%); opacity: 0; transition-duration: 1s;transition-delay: .4s}

#index .box05 {background: url("img/index/box05_bg.jpg")bottom center no-repeat; padding: 80px 0;}
#index .box05 .big {font-size: 40px; line-height: 1;}
#index .box05 h2 {font-size: 18px; margin: 20px auto 50px;}
#index .box05 .list::before {content: ''; position: absolute; background: url("img/index/box05_icon05.png")no-repeat; width: 232px; height: 250px; top: -280px; left: -250px;}
#index .box05 .inner{margin-bottom: 80px;}
#index .box05 a {font-size: 20px; width: 166px; position: relative; z-index: 10;}
#index .box05 .icon01 {position: absolute; left: -250px; top: -70px;}
#index .box05 .icon02 {position: absolute; right: -180px; top: -50px;}
#index .box05 .icon03 {position: absolute; bottom: 250px; right: 230px;}
#index .box05 .icon04 {position: absolute; bottom: -100px; right: -250px;}
#index .box05 .con01 {margin-right: 100px; margin-left: 100px;}
#index .box05_gel1 {position: absolute; transform: scaleX(.8) scaleY(1.2) translateY(10%); opacity: 0; transition-duration: 1s;}
#index .box05_gel2 {position: absolute; transform: scaleX(.8) scaleY(1.2) translateY(10%); opacity: 0; transition-duration: 1s; transition-delay: .2s}
#index .box05_gel3 {position: absolute; transform: scaleX(.8) scaleY(1.2) translateY(10%); opacity: 0; transition-duration: 1s;transition-delay: .4s}


#index .box06 {background: url("img/index/box06_bg.jpg")center center no-repeat;}
#index .box06 .big {font-size: 40px; line-height: 1;}
#index .box06 h2 {font-size: 18px; margin: 15px auto 60px;}
#index .interview_item {width: 270px; margin: 40px 40px 0 0;}
#index .interview_item:nth-child(4n) {margin-right: 0;}
#index .interview_img img {width: 100%; height: 180px; object-fit: cover;}
#index .box06 h3 {line-height: 1.3; margin: 10px auto 5px;}
#index .box07 {position: relative;}
#index .box07 .bg_icon {position: absolute; left: 0; right: 0; top: 20px;}
#index .box07 .big {font-size: 40px; line-height: 1;}
#index .box07 h2 {font-size: 18px; margin: 15px auto 40px;}
#index .album_item {width: 190px; margin: 10px 10px 0 0;}
#index .album_item:nth-child(6n) {margin-right: 0;}
#index .album_item img {width: 100%; height: 190px; object-fit: cover;}
#index #album_list::before {position: absolute; content: ""; bottom: -440px; left: -600px; background: url("img/index/box07_bg02.png")no-repeat; width: 575px; height: 705px;}
#index #album_list::after {position: absolute; content: ""; top: -250px; right: -600px; background: url("img/index/box07_bg.png")no-repeat; width: 575px; height: 705px;}
#index .box08 {background-color: #f7f7f7; position: relative;}
#index .box08 .bg_icon {position: absolute; left: 0; top: 400px;}
#index .box08 .bg_icon02 {position: absolute; right: 0; bottom: 200px;}
#index .box08 .big {font-size: 40px; line-height: 1;}
#index .box08 .big::before,#index .box08 .big::after {content: ""; background-color: #000; height: 1px; width: 100%; margin-right: 40px;}
#index .box08 .big::after {margin-right: 0; margin-left: 40px;}
#index .box08 h2 {margin: 25px auto 50px; font-size: 18px;}
#index .box08 .img {position: relative; z-index: 10;}
#index .box08 iframe {width: 1200px; height: 400px; box-sizing: border-box; border: 1px solid #000; margin: 50px auto; display: block;}
#index .box08 .inner {margin-top: 50px; position: relative; z-index: 10;}
#index .box08 .address {font-size: 25px;}
#index .box08 h3 {font-size: 25px; line-height: 1;}
#index .box08 .table {margin: 20px 0;}
#index .box08 .txt01 {font-size: 18px; margin-bottom: 20px; width: 475px;}
#index .box08 .txt01:last-child {margin-bottom: 0;}
#index .box08 .txt02 {margin-top: 10px; font-size: 16px;}
#index .box08 .inner03 .txt01 {font-size: 18px; line-height: 1; margin: 20px 0;}
#index .box08 .inner03 .txt02 {font-size: 16px; line-height: 2;}
#index .box08 .inner03 .table02 {margin-top: 20px;}
#index .box09 {background: url("img/index/box09_bg.jpg")center center no-repeat;}
#index .box09 .big {font-size: 40px; line-height: 1;}
#index .box09 h2 {font-size: 18px; margin: 16px auto 80px;}
#acMenu dt{
width:480px;
line-height:1;
border:#000 1px solid;
cursor:pointer;
padding: 15px 55px 15px 15px;
box-sizing: border-box;
font-weight: bold;
border-top: none;
background:url("img/index/box09_bg01.png") no-repeat;
background-position: center right 10px;
border-left: none;
border-right: none;
}
#acMenu dt img,#acMenu dd img {margin-right: 20px;}
#acMenu dd{
width:480px;
line-height:1.5;
box-sizing: border-box;
display:none;
padding: 15px;
background-color: #eee;
}
#acMenu #acMenu:nth-of-type(1) dt {border-top: 1px solid #000;}
#acMenu dt.active{background:url("img/index/box09_bg02.jpg") no-repeat; background-position: center right 10px;}
#acMenu h3 {line-height: 1.3;}
#index .box10 {background: url("img/index/box10_bg.jpg")top 180px center no-repeat;}
#index .box10 .big {font-size: 40px; line-height: 1;}
#index .box10 h2 {font-size: 18px; margin: 15px auto 80px;}
#index .time {font-size: 16px; margin-right: 16px;}
#index .blog_area {font-size: 14px; box-sizing: border-box; border: 5px solid #ccc; padding: 35px; width: 1080px; margin: auto; background-color: #fff; position: relative;}
#index .box10 .blog_area::after {content: ''; position: absolute; background: url("img/index/box10_bg_icon.png")no-repeat; width: 250px; height: 146px; right: -150px; bottom: -140px;}
#index .box11 .blog_area::after {display: none;}
#index .blog_item {box-sizing: border-box; border-bottom: 1px solid #000; padding-bottom: 20px; margin-bottom: 20px; line-height: 1;}
#index .blog_item:nth-last-child(1) {margin-bottom: 0;}
#index .tag {background-color: #ffa3c4; width: 50px; height: 18px; margin: 0 15px;}
#index .box11 {background: url("img/index/box11_bg.png")top 180px center no-repeat; background-color: #fafafa;}
#index .box11 .tag {background-color: #e62388;}
#index .inview02 {transform: scaleX(1) scaleY(1) translateY(0px)!important; opacity: 1!important;}
#index .box11 .btn {position: relative;}
#index .box11 .btn::before {position: absolute; content: ''; background: url("img/index/box11_bg_icon.png")no-repeat; width: 350px; height: 411px; left: -750px; bottom: -100px;}
#index .box13 a {width: 500px; height: 200px; margin: auto;}
#index .box14 {background: url("img/index/box14_bg.jpg")center center no-repeat;}
#index .box14 .big {font-size: 40px; line-height: 1; margin-bottom: 50px;}
#index .box14 video {display: block; width: 700px; height: 400px; margin: auto;}



/*========================
FOOTER
========================*/
footer {background: url("img/footer/bg.jpg")center center no-repeat; padding-top: 85px;}
footer .f_insta {margin-top: 50px; display: inline-block;}
footer .copyright_area {background-color: #333; padding: 5px 0; margin-top: 50px; font-size: 12px;}
footer .copyright_area p {margin-right: 20px;}

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

#pop_banner {position: fixed; bottom: 20px; z-index: 100; width: 100%;}
#pop_banner .pop_inner {box-sizing: border-box; border: 2px solid #f19cc1; background-color: #fff;}
#pop_banner .icon01 {box-sizing: border-box; margin-right: 15px; -webkit-transition: all 0.5s ease; background-color: #ffa3c4;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all  0.5s ease;
	width: 182px;
}
#pop_banner .icon01:hover {
  background-color: #e62388;
  -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;}
#pop_banner .icon01 img{margin: auto;}
/*========================
ページ設定
========================*/
/*
サムネ
*************/
.page_thumb {
width: 100%;
margin: auto;
box-sizing: border-box; 
background: url(img/thumb_bg.jpg)center center no-repeat;
height: 400px;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
font-size: 30px;
letter-spacing: 5px;
line-height: 1;
}
.page_thumb span {font-size: 20px;}
.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: 20px;
line-height: 1;
margin-bottom: 40px;
}
.big_page_title {font-size: 40px; letter-spacing: 5px; margin-bottom: 5px;}


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

.previous-entries,.next-entries {
color: #000;
width: 80px;
background: #ccc;
padding: 6px 0 0 10px;
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: #ccc;
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;
}
}