@charset "utf-8";
/*--------------------------------------
	copyright : yuyu design.
--------------------------------------*/

@import url(normalize.css);
@import url(../plugin/fontawesome/css/all.min.css);
@import url(../plugin/aos/aos.css);
/*@import url(../plugin/OwlCarousel/assets/owl.carousel.min.css); @import url(../plugin/OwlCarousel/assets/owl.theme.default.css);*/
/*@import url(../plugin/lightGallery/css/lightgallery.min.css);*/
/*@import url(../plugin/Remodal/remodal.css); @import url(../plugin/Remodal/remodal-default-theme.css);*/
/* @import url(../plugin/slick/slick.css); @import url(../plugin/slick/slick-theme.css); */
@import url(common_parts.css);
@import url(common.css);

/*
 division
==============================*/

body.index { background-color: #629CDE; }

/* index-header ----------*/
#index-header { padding: 13rem 2rem 25rem; background-image: url(../images/division/bg_1.svg); background-position: center bottom; background-repeat: no-repeat; }
#index-header h1 { margin-bottom: 7rem; color: #FFF; line-height: 1; }
#index-header h1 span { display: block; text-align: center; }
#index-header h1 .e { font-size: 10rem; font-weight: 800; font-family: 'Saira Extra Condensed', sans-serif; letter-spacing: 0.05em; }
#index-header h1 .j { margin-top: 3rem; font-size: 3.6rem; }
#index-header p { color: #FFF; text-align: center; line-height: 2.2; }
@media screen and (max-width:1460px) {
	#index-header { background-size: 140%; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#index-header { padding: 4rem 2rem 12rem; background-image: url(../images/division/bg_1_sp.svg); background-size: 100%; }
	#index-header h1 { margin-bottom: 4rem; }
	#index-header h1 .e { font-size: 8rem; }
	#index-header h1 .j { margin-top: 1rem; font-size: 2.4rem; }
	#index-header p { text-align: left; line-height: 1.8; font-size: 1.6rem; }
}

/* index-contents ----------*/
#index-contents { margin-top: -1px; background-color: #FFF; }
#index-contents .division_list {}
#index-contents .division_list li { padding: 6rem 3rem 4rem; border-radius: 3rem; color: #FFF; background-color: #003B80; }
#index-contents .division_list li span { display: block; }
#index-contents .division_list li .h { margin-bottom: 4rem; text-align: center; font-size: 3.6rem; font-weight: bold; }
#index-contents .division_list li .pw { padding: 0 2rem; }
#index-contents .division_list li .t { margin-top: 3rem; }
#index-contents .division_list li .btw { margin-top: 2rem; }

/* index-footer ----------*/
#index-footer { margin-top: -1px; padding-top: 32rem; background-image: url(../images/division/bg_2.svg); background-position: center top; background-repeat: no-repeat; }
@media screen and (max-width:1460px) {
	#index-footer { padding-top: 25%; background-size: 140%; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#index-footer { padding-top: 35%; background-image: url(../images/division/bg_2_sp.svg); background-size: 100%; }
}

/* detail-header ----------*/
#detail-header { width: 100%; overflow: hidden; margin-bottom: -10rem; padding-top: 8rem; }
#detail-header .inner { display: flex; }
#detail-header h1 { padding-top: 4rem; color: #FFF; line-height: 1.4; }
#detail-header h1 span { display: block; }
#detail-header h1 .j { margin-bottom: 2rem; font-size: 6rem; }
#detail-header h1 .e { opacity: 0.54; line-height: 1; font-size: 6rem; font-family: 'Saira Extra Condensed', sans-serif; font-weight: 600; }
#detail-header .tw { width: 40%; padding-bottom: 14rem; }
#detail-header .pw { width: 60%; }
#detail-header .pw img { position: relative; right: -5rem; }
@media screen and (max-width:1200px) {
	#detail-header h1 .j { margin-bottom: 2rem; font-size: 5vw; }
	#detail-header h1 .e { font-size: 5vw; }
}
@media screen and (max-width:1024px) { /* iPad 横 l */
	#detail-header {  margin-bottom: -6rem; padding-top: 2rem; }
	#detail-header h1 .j { font-size: 8vw; }
	#detail-header h1 .e { font-size: 8vw; }
	#detail-header .inner { display: block; }
	#detail-header .tw { width: 100%; padding-bottom: 3rem; }
	#detail-header .pw { width: 100%; text-align: center; }
	#detail-header .pw img { right: -4rem; max-width: 80%; }
}

/* detail-about ----------*/
#detail-about { padding: 4rem 0 6rem; background-color: #629CDE; }
#detail-about h2 { position: relative; display: inline-block; margin-bottom: 4rem; padding: 3rem 5rem; border-radius: 8rem; color: #EF4E16; background-color: #FFF; line-height: 1.2; font-size: 2.8rem; }
#detail-about h2::before { position: absolute; top: calc(100% - 1px); left: 0; right: 0; content: ""; width: 2.5rem; height: 2.6rem; margin: auto; background-image: url(../images/common/window_arrow.svg); background-repeat: no-repeat; background-position: center; background-size: cover; }
#detail-about p { color: #FFF; font-size: 2rem; }
@media screen and (max-width:1024px) { /* iPad 横 l */
	#detail-about { padding: 8rem 0 4rem; }
	#detail-about h2 { margin-bottom: 2rem;  padding: 2rem 3rem; font-size: 2.4rem; }
}

/* detail-toface ----------*/
#detail-toface { margin-bottom: -10rem; padding-top: 6rem; }
#detail-toface .inner { padding-left: 6rem; padding-right: 6rem; }
#detail-toface .w { position: relative; z-index: 1; max-width: 103rem; margin: auto; padding: 6rem 10rem; border-radius: 8rem; background-color: #FFF; }
#detail-toface .w h2 { margin-bottom: 6rem; color: #003B80; text-align: center; font-size: 4rem; font-weight: 900; }
#detail-toface .w .pw { margin-bottom: 4rem; text-align: center; }
#detail-toface .w p {}
@media screen and (max-width:896px) { /* iPhone 横 m */
	#detail-toface .w {  padding: 4rem; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#detail-toface .w {  padding: 4rem 3rem; border-radius: 6rem; }
}

/* message keyword common ----------*/
#detail-message h2, #detail-keyword h2 { margin-bottom: 4rem; line-height: 1; }
#detail-message h2 span, #detail-keyword h2 span { display: block; color: #FFF; text-align: center; }
#detail-message h2 .e, #detail-keyword h2 .e { font-size: 8rem; font-family: 'Saira Extra Condensed', sans-serif; font-weight: 800; }
#detail-message h2 .j, #detail-keyword h2 .j { margin-top: 2.5rem; font-size: 2rem; }

/* detail-message ----------*/
#detail-message { position: relative; padding: 18rem 0 9rem; background-color: #629CDE; }
#detail-message::before { position: absolute; bottom: calc(100% - 3px); left: 0; content: ""; width: 100%; height: 13rem; background-image: url(../images/division/bg_3.svg); background-repeat: no-repeat; background-position: center bottom; background-size: contain; }
#detail-message .w { max-width: 103rem; margin: auto; }
#detail-message .voice { display: flex; align-items: center; }
#detail-message .voice .tw { position: relative; width: calc(100% - 23rem - 6rem); padding: 5rem; border-radius: 8rem; background-color: #FFF; }
#detail-message .voice .tw::before { position: absolute; top: 0; bottom: 0; left: calc(100% - 1px); content: ""; width: 2.5rem; height: 2.6rem; margin: auto; background-image: url(../images/common/window_arrow.svg); background-repeat: no-repeat; background-position: center; background-size: cover; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }
#detail-message .voice .pw { width: 23rem; margin-left: 6rem; }
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#detail-message .voice { display: block; }
	#detail-message .voice .tw::before { top: calc(100% - 1px); bottom: auto; left: 0; right: 0; margin: auto; -webkit-transform: rotate(0); transform: rotate(0); }
	#detail-message .voice .tw { width: 100%; padding: 3rem 4rem; border-radius: 6rem; }
	#detail-message .voice .pw { width: 100%; margin-left: 0; text-align: center; margin-top: 4rem; }
	#detail-message .voice .pw img { max-width: 20rem; }
}

/* detail-keyword ----------*/
#detail-keyword { padding-top: 6rem; padding-bottom: 14rem; }
#detail-keyword .w { position: relative; max-width: 103rem; margin: auto; padding: 8rem 12rem; border-radius: 20rem; background-color: #FFF; }
#detail-keyword .w::before { position: absolute; top: calc(100% - 7rem); left: 0; right: 0; content: ""; width: 39.8rem; height: 21rem; margin: auto; background-image: url(../images/division/bg_4.svg); background-repeat: no-repeat; background-position: center; background-size: contain; }
#detail-keyword .w ul {}
#detail-keyword .w ul li {}
#detail-keyword .w ul li span { display: block; padding: 1.5rem 1rem; border-radius: 10rem; color: #003B80; background-color: #FAF000; text-align: center; text-decoration: none; line-height: 1.2; font-size: 2rem; }
@media screen and (max-width:1024px) { /* iPad 横 l */
	#detail-keyword .w { padding: 6rem 6rem 8rem; border-radius: 15rem; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#detail-keyword .w { padding: 5rem 3rem 8rem; border-radius: 10rem; }
}