@charset "UTF-8";

#page .page_section.section_about{background-color:#2F2F2F;}
#page .page_section.section_system:before{content:"";position:absolute;z-index:0;left:0;top:0;margin:0;padding:0;width:100%;height:400px;background-color:#C4C4C4;}
#page .page_section.section_service{background-color:#2F2F2F;}
#page .page_section.section_service:after{content:"";position:absolute;z-index:0;left:calc(50% + 600px);bottom:0;transform:translateX(-100%);margin:0;padding:0;width:440px;aspect-ratio:440/375;background-image:url("../img/section_service_bg.jpg");background-size:auto 100%;background-repeat:no-repeat;background-position:center center;}

@media all and (max-width:1200px)
{
	#page .page_section.section_system:before{height:350px;}
}
@media all and (max-width:1000px)
{
	#page .page_section.section_system:before{height:300px;}
	#page .page_section.section_service{padding-bottom:250px;}
	#page .page_section.section_service:after{left:50%;transform:translateX(-50%);width:auto;height:250px;}
}
@media all and (max-width:800px)
{
	#page .page_section.section_system:before{height:350px;}
}


#page .component_about{position:relative;margin:0;padding:90px 0;height:550px;box-sizing:border-box;display:flex;flex-wrap:nowrap;flex-direction:column;}
#page .component_about .text{position:relative;z-index:1;margin:0;padding:0;display:flex;flex-wrap:nowrap;flex-direction:column;justify-content:space-between;gap:20px;flex:1;}
#page .component_about .text .top{position:relative;margin:0;padding:0;}
#page .component_about .text .top .title{position:relative;margin:0;padding:0;font-size:50px;font-weight:500;color:#FFFFFF;line-height:1.3;}
#page .component_about .text .top .title b{font-weight:800;}
#page .component_about .text .bottom{position:relative;margin:0;padding:0;display:flex;flex-wrap:nowrap;flex-direction:column;gap:30px;}
#page .component_about .text .bottom .description{position:relative;margin:0;padding:0;font-size:18px;font-weight:500;color:#FFFFFF;line-height:1.6;word-break:keep-all;}
#page .component_about .text .bottom .description .point{position:relative;margin:0;padding:0;font-size:22px;font-weight:800;color:#0F0F0F;line-height:1.6;background-color:#E9E9E9;}
#page .component_about .text .bottom .button{position:relative;margin:0;padding:5px 30px;height:48px;border-radius:24px;-webkit-appearance:none;font-size:18px;font-weight:700;color:#0F0F0F;line-height:1.3;text-decoration:none;text-align:center;cursor:pointer;box-sizing:border-box;background-color:#FFFFFF;transition:background-color ease 250ms;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:center;gap:20px;align-self:flex-start;}
#page .component_about .text .bottom .button:after{content:"";position:relative;display:block;margin:0;padding:0;width:44px;height:11px;background-image:url("../img/component_about_button_arrow.png");background-size:auto 100%;background-repeat:no-repeat;background-position:center right;}
#page .component_about .text .bottom .button:hover{background-color:#FAFAFA;}
#page .component_about .text .bottom .button:active{background-color:#F6F6F6;}
#page .component_about .image{position:absolute;z-index:0;right:0;top:0;height:100%;width:680px;aspect-ratio:680/548;background-size:auto 100%;background-repeat:no-repeat;background-position:center center;background-image:url("../img/component_about_image.jpg");}

@media all and (max-width:1200px)
{
	#page .component_about .image{right:-100px;}
	#page .component_about .text .top .title{font-size:40px;}
	#page .component_about .text .bottom .description{font-size:16px;}
	#page .component_about .text .bottom .description .point{font-size:1.2em;}
}
@media all and (max-width:1000px)
{
	#page .component_about{padding:40px 0 0;height:auto;}
	#page .component_about .text{flex:0;gap:30px;}
	#page .component_about .text .top .title{font-size:30px;text-align:center;}
	#page .component_about .text .bottom .description{font-size:14px;text-align:center;}
	#page .component_about .text .bottom .button{padding:5px 20px;height:45px;border-radius:23px;font-size:16px;align-self:center;gap:10px;}
	#page .component_about .text .bottom .button:after{width:20px;}
	#page .component_about .image{position:relative;right:auto;top:auto;margin-top:-10px;width:auto;height:250px;}
}


#page .component_summary{position:relative;margin:0;padding:30px;list-style:none;display:flex;flex-wrap:nowrap;flex-direction:row;justify-content:space-between;gap:20px;background-color:#E9E9E9;}
#page .component_summary li{position:relative;margin:0;padding:0;}
#page .component_summary .item{position:relative;margin:0;padding:0;font-size:18px;font-weight:500;color:#0F0F0F;line-height:1.6;}
#page .component_summary .item .value{position:relative;margin:0;padding:0;font-size:25px;font-weight:800;color:#0F0F0F;line-height:1.3;margin-right:10px;}
#page .component_summary .item .value .number{position:relative;margin:0;padding:0;font-size:45px;font-weight:900;color:#0F0F0F;letter-spacing:-0.025em;}

@media all and (max-width:1000px)
{
	#page .component_summary{padding:20px;display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
	#page .component_summary .item{text-align:center;font-size:14px;}
	#page .component_summary .item .value{font-size:1.4em;margin-right:0.4em;}
	#page .component_summary .item .value .number{font-size:1.8em;}
}
@media all and (max-width:600px)
{
	#page .component_summary{padding:20px;display:flex;flex-direction:column;gap:0;}
	#page .component_summary li:nth-child(n+2):before{content:"";position:relative;display:block;margin:20px 0;height:1px;background-color:#DDDDDD;}
}


#page .component_directing{position:relative;margin:0;padding:0;list-style:none;display:flex;flex-wrap:nowrap;flex-direction:row;justify-content:space-between;gap:20px;}
#page .component_directing li{position:relative;margin:0;padding:0;max-width:370px;display:flex;flex-wrap:nowrap;flex-direction:column;flex:1;}
#page .component_directing .item{position:relative;margin:0;padding:25px;border:1px solid #AAAAAA;text-decoration:none;background-color:#FFFFFF;box-sizing:border-box;display:flex;flex-wrap:nowrap;flex-direction:column;gap:25px;flex:1;}
#page .component_directing .item .image{position:relative;margin:0;padding:0;border-radius:10px;height:150px;background-color:#EFEFEF;background-size:cover;background-repeat:no-repeat;background-position:center center;}
#page .component_directing .item .text{position:relative;margin:0;padding:0;display:flex;flex-wrap:nowrap;flex-direction:column;gap:15px;}
#page .component_directing .item .text .title{position:relative;margin:0;padding:0;font-size:20px;font-weight:800;color:#0F0F0F;line-height:1.3;}
#page .component_directing .item .text .description{position:relative;margin:0;padding:0;font-size:18px;font-weight:500;color:#0F0F0F;line-height:1.6;word-break:keep-all;}
#page .component_directing .item .image.image1{background-image:url("../img/component_directing_image1.jpg");}
#page .component_directing .item .image.image2{background-image:url("../img/component_directing_image2.jpg");}
#page .component_directing .item .image.image3{background-image:url("../img/component_directing_image3.jpg");}
#page .component_directing.slick-slider{display:block;}
#page .component_directing.slick-slider .slick-list li{display:block;max-width:initial;}
#page .component_directing.slick-slider .slick-dots{position:relative;margin:0;padding:0;list-style:none;margin-top:20px;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:center;gap:10px;}
#page .component_directing.slick-slider .slick-dots li{position:relative;margin:0;padding:0;flex:0;}
#page .component_directing.slick-slider .slick-dots button{position:relative;display:block;margin:0;padding:0;border:0;border-radius:50%;-webkit-appearance:none;width:10px;aspect-ratio:1/1;font-size:0;color:transparent;background-color:#000000;opacity:0.2;cursor:pointer;transition:opacity ease 250ms;}
#page .component_directing.slick-slider .slick-dots .slick-active button{opacity:1;}

@media all and (max-width:1200px)
{
	#page .component_directing .item{padding:20px;}
	#page .component_directing .item .text .title{font-size:18px;}
	#page .component_directing .item .text .description{font-size:16px;}
}
@media all and (max-width:1000px)
{
	#page .component_directing{gap:15px;}
	#page .component_directing .item{padding:15px;}
	#page .component_directing .item .text .title{font-size:16px;}
	#page .component_directing .item .text .description{font-size:14px;}
}
@media all and (max-width:800px)
{
	#page .component_directing.slick-slider .slick-list{overflow:visible;}
	#page .component_directing.slick-slider .slick-list li{margin:0 8px;width:300px;}
	#page .component_directing.slick-slider .item{height:350px;}
}


#page .component_system{position:relative;margin:0;padding:0;list-style:none;display:flex;flex-wrap:nowrap;flex-direction:row;justify-content:space-between;gap:20px;}
#page .component_system li{position:relative;margin:0;padding:0;max-width:550px;display:flex;flex-wrap:nowrap;flex-direction:column;flex:1;}
#page .component_system .item{position:relative;margin:0;padding:0;border-radius:20px;border:2px solid #E9E9E9;text-decoration:none;background-color:#FFFFFF;box-sizing:border-box;display:flex;flex-wrap:nowrap;flex-direction:column;flex:1;}
#page .component_system .item .header{position:relative;margin:0;padding:40px 20px;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:center;}
#page .component_system .item .header .title{position:relative;margin:0;padding:5px 30px;height:40px;border-radius:20px;border:1.5px solid #0F0F0F;font-size:18px;font-weight:500;color:#0F0F0F;line-height:1;text-align:center;box-sizing:border-box;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:center;}
#page .component_system .item .header .title b{font-weight:800;}
#page .component_system .item .body{position:relative;margin:0;padding:0;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:space-between;}
#page .component_system .item .body .image{position:relative;margin:0;padding:0;width:250px;aspect-ratio:250/306;background-size:100%;background-repeat:no-repeat;background-position:center bottom;flex-shrink:0;}
#page .component_system .item .body .text{position:relative;margin:0;padding:0;padding-right:20px;flex-grow:1;}
#page .component_system .item .body .text .description{position:relative;margin:0;padding:0;font-size:18px;font-weight:500;color:#0F0F0F;line-height:1.6;word-break:keep-all;}
#page .component_system .item .body .image.image1{background-image:url("../img/component_system_image1.png");}
#page .component_system .item .body .image.image2{background-image:url("../img/component_system_image2.png");}

@media all and (max-width:1200px)
{
	#page .component_system .item .body .text .description{font-size:16px;}
	#page .component_system .item .body .image{width:200px;}
}
@media all and (max-width:1000px)
{
	#page .component_system{gap:15px;}
	#page .component_system li{max-width:initial;}
	#page .component_system .item{border-radius:10px;}
	#page .component_system .item .header{padding:20px 15px;}
	#page .component_system .item .header .title{padding:0 20px;font-size:16px;}
	#page .component_system .item .body .text .description{font-size:14px;}
	#page .component_system .item .body .image{width:160px;}
}
@media all and (max-width:800px)
{
	#page .component_system{flex-direction:column;}
}
@media all and (max-width:600px)
{
	#page .component_system .item .body .image{width:120px;}
}


#page .component_location{position:relative;margin:0;padding:0;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:20px;}
#page .component_location .address{position:relative;margin:0;padding:0;margin-right:auto;list-style:none;width:480px;font-size:18px;font-weight:500;color:#282828;line-height:1.6;word-break:keep-all;display:flex;flex-wrap:nowrap;flex-direction:column;gap:20px;flex-shrink:0;}
#page .component_location .address li{position:relative;margin:0;padding:0;}
#page .component_location .address li.icon{padding-left:30px;}
#page .component_location .address li.icon:before{content:"";position:absolute;left:0;top:2px;width:22px;aspect-ratio:1/1;background-size:100%;background-repeat:no-repeat;background-position:center center;}
#page .component_location .address a{text-decoration:none;color:inherit;}
#page .component_location .address .line3{color:#FF5E06;}
#page .component_location .map{position:relative;margin:0;padding:0;margin-left:auto;margin-top:-80px;width:700px;aspect-ratio:700/510;background-color:#E9E9E9;overflow:hidden;flex-grow:1;}
#page .component_location .map iframe{position:absolute;left:0;top:0;width:100%;height:100%;margin:0;padding:0;border:0;width:100%;height:100%;}
#page .component_location .address li.icon.pin:before{background-image:url("../img/component_location_icon_pin.png");}
#page .component_location .address li.icon.tel:before{background-image:url("../img/component_location_icon_tel.png");}

@media all and (max-width:1200px)
{
	#page .component_location .address{width:400px;font-size:16px;}
	#page .component_location .address li.icon{padding-left:1.6em;}
	#page .component_location .address li.icon:before{width:1.2em;}
}
@media all and (max-width:1000px)
{
	#page .component_location{margin:0 auto;max-width:600px;flex-direction:column;align-items:initial;gap:30px;}
	#page .component_location .address{margin:0;font-size:14px;gap:15px;}
	#page .component_location .map{margin:0;width:auto;}
}


#page .component_contact_button{position:relative;margin:0;padding:5px 30px;height:48px;border-radius:0;-webkit-appearance:none;font-size:18px;font-weight:700;color:#0F0F0F;line-height:1.3;text-decoration:none;text-align:center;cursor:pointer;box-sizing:border-box;background-color:#C4C4C4;transition:background-color ease 250ms;display:flex;flex-wrap:nowrap;flex-direction:row;align-items:center;justify-content:center;gap:20px;align-self:flex-start;}
#page .component_contact_button:after{content:"";position:relative;display:block;margin:0;padding:0;width:44px;height:11px;background-image:url("../img/component_contact_button_arrow.png");background-size:auto 100%;background-repeat:no-repeat;background-position:right center;}
#page .component_contact_button:hover{background-color:#BFBFBF;}
#page .component_contact_button:active{background-color:#BABABA;}

@media all and (max-width:1000px)
{
	#page .component_contact_button{font-size:16px;}
	#page .component_contact_button:after{width:20px;}
}