@charset "utf-8";

/* ------------------------------------------------------------ common */
main{ position: relative; }
main:after{ position: absolute; content: ""; bottom: -300px; left: 0; width: 100%; height: 732px; background: url(../images/common/bgC_07.png) center bottom/cover no-repeat; z-index: 0; }

#gloval{ padding: 45px 0 30px; }

.cta.pine{ margin: 75px 0 0; }


.information{ overflow: hidden; position: relative; z-index: 1; padding: 95px 0 165px; }
.information:before{ position: absolute; top: 0; left: 0; content: ""; width: 90%; height: 690px; background: url(../images/index/bg_01.jpg) center/cover no-repeat; z-index: -1; }

.information .bg{ padding: 130px 0 100px;/*  background: url(../images/index/pic_07.png) calc(50% + 300px) top no-repeat; */ }
.information h6{ font-size: 40px; line-height: 160%; }

.productivity{ padding: 70px 0 0; }
.productivity p{ padding: 35px 0 0; font-size: 26px; line-height: 190%; text-align: center; letter-spacing: 0.23em; }
/* .productivity figure{ display: flex; justify-content: space-between; } */
.productivity figure img:first-of-type{ margin: 0 50px 0 0; }

.news_list li:not(:last-of-type){ border-bottom: 1px solid #A0A0A0; }
.news_list li a{ display: flex; justify-content: space-between; padding: 30px 0; }
.news_list li figure{ width: 340px; }
.news_list li figure img{ width: 100%; height: auto; }

.news_list li .box{ width: 720px; }
.news_list li .box h6{ padding: 0 0 15px; font-size: 20px; line-height: 150%; }
.news_list li .box h6 small{ display: block; padding: 0 0 5px; font-size: 16px; color: #626262; font-family: din-2014, sans-serif; font-weight: 300; font-style: normal; }
.news_list li .box p{ padding: 0; font-size: 15px; line-height: 150%; }

/* ------------------------------------------------------------ case */
.case{ margin: 0 0 0 calc( (100% - 1200px) / 2 ); }
.case h6{ padding: 0 0 10px; font-size: 20px; }
.case p{ font-size: 15px; }


/* ------------------------------------------------------------ program */
.program{ margin: 0 0 0 calc( (100% - 1200px) / 2 ); }
.program_slider{ padding: 35px 0 0; }
.program_slider .slider_item{ float: left; width: 290px; margin: 0 45px 0 0; }
.program_slider .slider_item:last-of-type{ margin: 0; }

.program_slider .slider_item img{ width: 100%; height: auto; }

.program_slider .slider_item .description{ padding: 13px 0 0; }
.program_slider .slider_item .case_sub{ padding: 0 0 10px; font-size: 20px; text-align: center; }
.program_slider .slider_item .txt{ font-size: 14px; font-family: 'Noto-Sans-JP-Regular'; line-height: 200%; }

.slick-list{ overflow: hidden; }



/* ------------------------------------------------------------ fv */
#fv{ background: url(../images/index/bg_fv.jpg) right 15% center/cover no-repeat; }
#fv h2{ font-size: 43px; line-height: 150%; letter-spacing: 0.2em; font-family: 'Noto-Sans-JP-Regular'; }
#fv h2 small{ display: block; padding: 0 0 25px; font-size: 20px; line-height: 160%; letter-spacing: 0.23em; }
#fv h2 span{ display: block; padding: 35px 0 0; font-size: 14px; line-height: 230%; letter-spacing: 0.23em; }


/* ------------------------------------------------------------ sv */
#sv{ padding: 330px 0 100px; color: #fff; background: url(../images/index/bg_sv.jpg) center/cover no-repeat; }
#sv .txt{ margin: 0 0 0 5%; }
#sv h3{ padding: 0 0 35px; font-size: 26px; letter-spacing: 0.1em; line-height: 180%; }
#sv p{ font-size: 16px; line-height: 220%; letter-spacing: 0.06em; }


/* ------------------------------------------------------------ sec01 */
#sec01 .list_04 article .item{ width: 100%; }
#sec01 .list_04 article .w_box{ position: relative; }
#sec01 .list_04 article .w_box:before{ position: absolute; content: ""; width: 50%; height: 203px; background: #fff; left: 0; top: -70px; }
#sec01 .list_04 article .txt h5{ margin: 0 0 -50px; width: 1245px; }

#sec01 .list_04 article:nth-of-type(even) .w_box:before{ left: initial; right: 0; }
#sec01 .list_04 article:nth-of-type(even) .txt h5{ border-radius: 30px 0 0 0; padding: 70px 95px 10px 65px; left: calc(50% - 610px); }
#sec01 .list_04 article:nth-of-type(even) .case{ margin: 0 0 0 calc( (100% - 1100px) / 2 ); }

#sec01 .list_04 article:first-of-type .txt,
#sec01 .list_04 article:nth-of-type(2) .txt,
#sec01 .list_04 #link05 .txt{ background: none; }

#sec01 .list_04 article .listC{ flex-direction: column; }
#sec01 .list_04 article .listC p{ width: 100%; }
#sec01 .list_04 article .listC .pic{ width: 100%; }

#sec01 #link01{ background: url(../images/index/bg_04.png) calc(50% - 200px) calc(100% - 500px) no-repeat; }

#sec01 #link02{ padding: 0 0 70px; position: relative; background: url(../images/common/bgC_05.png) calc(50% + 460px) 100%/450px no-repeat; }
#sec01 #link02:before{ position: absolute; content: ""; bottom: 0; left: calc(50% + 330px); width: 104px; height: 180px; background: url(../images/common/pine_03.svg) center/cover no-repeat; }
/* #sec01 #link02:after{ position: absolute; content: ""; z-index: 10; width: 620px; height: 535px; top: 600px; right: 0; background: url(../images/common/bgC_04.png) center/cover no-repeat; } */

#sec01 #link03{ background: url(../images/index/bg_03.png) center no-repeat; }
#sec01 #link03 .case .case_slider .slider_item{ margin: 0 50px 0 0; }

#sec01 #link04{ background: url(../images/index/bg_05.png) center bottom no-repeat; }
#sec01 #link05{ background: url(../images/index/bg_03.png) center no-repeat; }






/* ------------------------------------------------------------
	mobile
------------------------------------------------------------ */
@media only screen and (max-width: 640px) {

	main:after{ bottom: -32px; height: 722px; }


	.cta{ margin: 0 0 60px; }
	.footer{ padding: 100px 0 0; }

	.information{ margin: 30px 0 0; padding: 50px 0; }
	.information:before{ height: 440px; background: url(../images/index/bg_01-sp.jpg) center/cover no-repeat; }
	.information .bg{ padding: 0; background: none; }

	.information h6{ padding: 0 0 25px; font-size: 25px; }
	.information .item{ display: block; width: 100%; height: auto; }

	.productivity{ padding: 0; }
	.productivity figure img{ width: 100%; height: auto; }
	.productivity p{ font-size: 15px; text-align: left; font-family: 'Noto-Sans-JP-Regular'; }

	.news_list li a{ padding: 25px 0; flex-direction: column; }
	.news_list li figure{ width: 100%; }
	.news_list li .box{ padding: 20px 0 0; }
	.news_list li .box h6{ padding: 0 0 21px; font-size: 15px; line-height: 170%; }
	.news_list li .box h6 small{ padding: 0 0 10px; font-size: 13px; }
	.news_list li .box p{ font-size: 13px; line-height: 190%; }


/* ------------------------------------------------------------ case */
	.case{ margin: 0 0 0 5%; }
	.case h6{ font-size: 17px; width: 95%; }
	.case p{ font-size: 14px; font-family: 'Noto-Sans-JP-Regular'; width: 95%; }


/* ------------------------------------------------------------ program */
	.program{ margin: 0 0 0 5%; padding: 30px 0 0; }
	.program_slider{ padding: 0; }
	.program_slider .slider_item{ width: 250px; margin: 0 25px 0 0; }
	.program_slider .slider_item .description{ padding: 10px 0 0; }
	.program_slider .slider_item .case_sub{ padding: 0 0 5px; font-size: 15px; }
	.program_slider .slider_item .w_box{ font-size: 13px; line-height: 180%; }


/* ------------------------------------------------------------ fv */
	#fv{ position: relative; background: url(../images/index/bg_fv-sp.jpg) center/cover no-repeat; }
	#fv .txt{ position: absolute; bottom: 40px; }
	#fv h2{ font-size: 28px; }
	#fv h2 small{ padding: 0 0 15px; font-size: 12px; }
	#fv h2 span{ padding: 10px 0 0; font-size: 11px; letter-spacing: 0.17em; }


/* ------------------------------------------------------------ sv */
	#sv{ padding: 0; position: relative; height: 730px; background: url(../images/index/bg_sv-sp.jpg) center/cover no-repeat; }
	#sv .txt{ position: absolute; bottom: 50px; width: 90%; }
	#sv h3{ padding: 0 0 25px; font-size: 17px; letter-spacing: 0.1em; line-height: 180%; }
	#sv p{ font-size: 14px; line-height: 180%; }


/* ------------------------------------------------------------ sec01 */
	#sec01{ overflow: hidden; }

	#sec01 .case .txt { text-align: center;}
	#sec01 .list_04 article .w_box:before{ display: none; }

	#sec01 .list_04 article .txt h5{ padding: 25px 25px 0; margin: 0 0 -25px; top: -45px; width: 95%; }
	#sec01 .list_04 article .listC p{ padding: 0; font-size: 14px; }
	#sec01 .list_04 article:nth-of-type(even) .txt h5{ left: initial; margin: 0 0 -25px auto; padding: 25px 25px 0; }

	#sec01 .list_04 article li{ padding: 0 0 0 2%; }
	#sec01 .list_04 article:nth-of-type(even) li{ margin: 0 0 0 7%; padding: 0; }

	#sec01 .list_04 article:nth-of-type(even) .case{ margin: 0; }







}