@charset "UTF-8";
/* CSS Document */

:root {
    --color-01: #5C2E7E;
	--color-02: #1E2F35;
	--color-03: #853C97;
	--color-04: #3096B7;
}

/*------------------------------------------------------



------------------------------------------------------*/
main { padding-bottom: 0;}
.contents { padding-top: 0;}

@media (min-width: 768px) {
    
}

@media (max-width: 767px) {

}


/*------------------------------------------------------

	main-visual

------------------------------------------------------*/
#main-visual { position: relative;}

#video-area { position: absolute; z-index: -1; top: 0; right: 0; left: 0; bottom: 0; overflow: hidden; }
#video { position: absolute; z-index: -1; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 177.77777778vh; height: 56.25vw; min-height: 100%; min-width: 100%; }
#video.mode_sp { width: 100%; height: auto; }
#main-visual .container { position: absolute; height: 100%; left: 0; right: 0; top: 0;}
/* #emphasize-bnr { position: absolute;}
#emphasize-bnr a { background-color: #5C2E7E; display: block; }
#emphasize-bnr img { width: 100%; height: auto;} */
/* #main-visual form { position: absolute; background-color: rgba(255,255,255,0.5);}
#main-visual form input[name="keyword"] { height: 100%; border: none; padding: 5px; border-radius: 0; }
#main-visual form button { background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none; width: 55px; height: 100%; background-color: #5C2E7E; }
#main-visual form button img {} */


.volume_btn { position: absolute; z-index: 1; }
.volume_btn button { background-color: transparent; border: none; padding: 0; }



@media (min-width: 768px) {
	#main-visual { min-height: 600px; height: calc(56.25vw - 450px);}
	#main-visual .container { max-width: 1600px;}
	
	/* #emphasize-bnr { width: 355px; height: 305px; right: 10px; bottom: 30px;}
	#emphasize-bnr a { padding: 10px; }
	#emphasize-bnr img {} */
	
	/* #main-visual form { left: 0; right: 0; bottom: 40px; margin: auto; width: 700px; height: 80px; padding: 12px; }
	#main-visual form input[name="keyword"] { width: calc(100% - 55px); font-size: 1.6rem; }
	#main-visual form button {}
	#main-visual form button img { width: 36px; height: auto;} */

	.volume_btn { left: 10px; bottom: 10px;}
	.volume_btn button img { width: 48px; height: auto;}
}

@media (max-width: 767px) {
	#main-visual { height: 450px;}
	#main-visual .container {}
	
	/* #emphasize-bnr { width: 190px; height: 150px; right: 0; bottom: 30px; }
	#emphasize-bnr a { padding: 5px; }
	#emphasize-bnr img {} */
	
	/* #main-visual form { left: 0; right: 0; bottom: -20px; margin: auto; width: 100%; height: 46px; padding: 7px; }
	#main-visual form input[name="keyword"] { width: calc(100% - 30px); font-size: 1.4rem; margin-bottom: 0; }
	#main-visual form button { width: 30px;}
	#main-visual form button img { width: 19px; height: auto;} */

	.volume_btn { right: 10px; top: 60px;}
	.volume_btn button img { width: 27px; height: 17px;}
}



/*------------------------------------------------------

main-visual-slider

------------------------------------------------------*/
/* #main-visual-slider { position: absolute; z-index: -1; top: 0; right: 0; left: 0; bottom: 0; overflow: hidden;}
#main-visual-slider .slick-slide {}
#main-visual-slider .slick-slide img { width: 100%; height: auto;} */

#main-visual .catch-copy { position: absolute; }
#main-visual .catch-copy img { width: 100%; height: auto;}


/* @keyframes zoomUp {
	0% {
	  transform: scale(1);
	}
	100% {
	  transform: scale(1.15);
	}
  }
  #main-visual-slider .add-animation {
	animation: zoomUp 14s linear 0s normal both;
  } */

@media (min-width: 768px) {
	#main-visual .catch-copy { max-width: 560px; bottom: 70px; left: 20px; right: auto; top: auto; margin: auto; }
	#main-visual .catch-copy img {}
}
/* @media screen and (min-width:768px) and ( max-width:1920px) {
	#main-visual-slider .slick-slide { min-height: 600px; height: calc(56.25vw - 450px); }
	#main-visual-slider .slick-slide img { object-fit: cover; width: 100%; height: 100%;}
} */

@media screen and (min-width:768px) and ( max-width:1220px) {
	#main-visual .catch-copy { width: 55%;}
}

@media (max-width: 767px) {
	/* #main-visual-slider .slick-slide { height: 450px;}
	#main-visual-slider .slick-slide img { object-fit: cover; width: 100%; height: 100%;} */
	#main-visual .catch-copy { top: 74%; width: 76%; max-width: 722px; left: 0; right: 0; margin-left: auto; margin-right: auto; }
	#main-visual .catch-copy img {}

}



/*------------------------------------------------------

    about

------------------------------------------------------*/
#about { background-color: #D7E1E7; position: relative;}
#about::before { content: ""; position: absolute; width: 100%; height: 60px; background: linear-gradient(180deg, #DDE8EE 0%, #E4ECF1 100%); left: 0; top: 0;}
#about .container {}
#about .title-b { padding-top: 0;}
#about .title-b::before ,
#about .title-b::after { display: none;}
#about .title-b span { letter-spacing: 0.05em; line-height: 100%;}
#about .title-b small { letter-spacing: 0.05em; }

#about .l_col-3 {}
#about .l_col-3 section { background-color: #fff; border-bottom: 10px solid var(--color-01); box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.10);}
#about .l_col-3 section figure {}
#about .l_col-3 section figure img {}
#about .l_col-3 section > div {}
#about .l_col-3 section .title-c { text-align: center; line-height: normal;}
#about .l_col-3 section .title-c::after { width: 70px; height: 4px; right: 0; bottom: 0; margin: auto; }
#about .l_col-3 section .list-a { margin-top: 20px;}
#about .l_col-3 section .list-a li { line-height: 2.2; letter-spacing: 0.04em; border-bottom: 1px solid #C7CED2; margin-bottom: 0;}
#about .l_col-3 section .list-a li a { color: var(--color-02); text-decoration: none;}
#about .l_col-3 section .list-a li::before { width: 7px; height: 7px; top: calc(1em - 3px); }

@media (min-width: 768px) {
    #about { padding-top: 90px; padding-bottom: 60px;}
    #about .container { max-width: 1520px;}
    #about .title-b { margin-bottom: 40px;}
    #about .title-b span { font-size: 4.4rem;}
    #about .title-b small { font-size: 2.4rem;}

    #about .l_col-3 {}
    #about .l_col-3 section {}
    #about .l_col-3 section figure { margin-bottom: 30px;}
    #about .l_col-3 section figure img {}
    #about .l_col-3 section > div {}
    #about .l_col-3 section .title-c { min-height: 64px;}
    #about .l_col-3 section .list-a { margin-left: 30px; margin-right: 30px;}
    #about .l_col-3 section .list-a li { font-size: 1.6rem;}
    #about .l_col-3 section .list-a li a {}

    #about .l_col-3 section:nth-child(2) .title-c { font-size: 1.8rem;}
}

@media (max-width: 767px) {
    #about { padding-top: 90px; padding-bottom: 60px; }
    #about .container { margin-left: 0; margin-right: 0;}
    #about .title-b {}
    #about .title-b span { font-size: 2.8rem;}
    #about .title-b small { font-size: 1.8rem;}
    
    #about .l_col-3 {}
    #about .l_col-3 section { margin-bottom: 50px;}
    #about .l_col-3 section figure {}
    #about .l_col-3 section figure img {}
    #about .l_col-3 section > div { padding: 0 20px;}
    #about .l_col-3 section .title-c { font-size: 2rem; padding-bottom: 25px;}
    #about .l_col-3 section .title-c::after { width: 50px;}
    #about .l_col-3 section .list-a { margin-bottom: 20px;}
    #about .l_col-3 section .list-a li {}
    #about .l_col-3 section .list-a li a {}
    #about .l_col-3 section:last-child { margin-bottom: 0;}
}



/*------------------------------------------------------

    information

------------------------------------------------------*/
#information { background-color: #F0F5F8;}
#information .container {}
#information .title { color: var(--color-01); text-align: center; font-weight: bold; line-height: 1.3; letter-spacing: 0.05em; border-top: 1px solid var(--color-01); border-bottom: 1px solid var(--color-01); padding: 6px 0;}
#information .l_col-index {}
#information .l_col-index li {}

@media (min-width: 768px) {
    #information { padding: 100px 0 200px;}
    #information .container {}
    #information .title { font-size: 2.6rem; margin-bottom: 40px; }
    #information .l_col-index {}
    #information .l_col-index li { width: calc(50% - 20px);}
    #information .l_col-index.l_col-index.type-b li .l_col-link .text { min-height: 140px;}
    #information .l_col-index.type-b li .l_col-link .text p { font-size: 2.2rem;}
}

@media (max-width: 767px) {
    #information { padding: 50px 0 100px;}
    #information .container {}
    #information .title { font-size: 2.2rem; margin-bottom: 30px; }
    #information .l_col-index {}
    #information .l_col-index li { margin-bottom: 10px; box-shadow: none;}
    #information .l_col-index li .l_col-link figure { width: 32%;}
    #information .l_col-index li .l_col-link .text { width: 68%;}
    #information .l_col-index li:last-child .l_col-link .text p { font-size: 1.7rem;}
}



/*------------------------------------------------------



------------------------------------------------------*/


@media (min-width: 768px) {

}

@media (max-width: 767px) {

}



/*------------------------------------------------------



------------------------------------------------------*/


@media (min-width: 768px) {

}

@media (max-width: 767px) {

}



/*------------------------------------------------------



------------------------------------------------------*/


@media (min-width: 768px) {

}

@media (max-width: 767px) {

}