@charset "utf-8";
/* ===================================================
	Trek CSS
====================================================== */
/* ---------------------------------------------------
	Main title
------------------------------------------------------ */
.box_maintit{ background-image: url("../../img/trek/main_img.jpg");}
.box_maintit .tit{ width: 500px; height: 144px;}

@media screen and (max-width: 600px) {
.box_maintit .tit{ width: 300px; height: 84px; top: 74px; bottom: inherit;}
}


/* ---------------------------------------------------
	Section 1
------------------------------------------------------ */
#sec1{ padding: 40px 0 0; text-align: center;}
#sec1 h2{ font-size: 26px; line-height: 1.8; color: #286c35; padding: 0 0 20px;}
#sec1 p{ font-size: 15px; line-height: 2;}
#sec1 .img1{ padding: 50px 0 0; display: block; margin: 0 auto; width: 100%; max-width: 1400px;}
#sec1 .map1{ padding: 40px 0 0; display: block; margin: 0 auto; width: 100%; max-width: 1100px; }
#sec1 .cmn_btn1{ width: 320px}
#sec1 .cmn_btn1 span{ background: url("../../img/trek/ico_dl1.svg") no-repeat 20px center; background-size: 22px; padding: 0 0 0 30px;}
#sec1 .cmn_btn1:hover span{ background: url("../../img/trek/ico_dl2.svg") no-repeat 20px center; background-size: 22px;}
#sec1 .cmn_btn1 span::before,
#sec1 .cmn_btn1 span::after{ display: none;}

@media screen and (max-width: 600px) {
#sec1{ padding: 30px 0 0;}
#sec1 h2{ font-size: 20px; line-height: 1.5; padding: 0 0 15px;}
#sec1 p{ font-size: 14px; line-height: 1.7; padding: 0 4%; text-align: left;}
#sec1 .img1{ padding: 20px 0 0; width: 92%;}
#sec1 .map1{ padding: 20px 0 0; width: 92%;}
#sec1 .cmn_btn1{ width: 290px}
}


/* ---------------------------------------------------
	Section 2
------------------------------------------------------ */
#sec2{ padding: 80px 0 100px;}
#sec2 h2{ font-size: 26px; line-height: 1.8; color: #286c35; padding: 0 0 20px; text-align: center;}
#sec2 p{ font-size: 15px; line-height: 2; text-align: center;}
#sec2 .box_flex2,
#sec2 .box_flex3{ width: 1100px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap;}
#sec2 .box_flex2{ padding: 50px 0 0;}
#sec2 .box_flex2 .box_point{ width: 540px;}
#sec2 .box_flex2 .box_point p{ padding: 0 50px;}
#sec2 .box_flex3 .box_point{ width: 360px;}
#sec2 .box_flex3 .box_point h3{ font-size: 22px;}
#sec2 .box_flex3 .box_point p{ padding: 0 25px;}
#sec2 .box_flex1{ width: 1100px; margin: 0 auto;}
#sec2 .box_flex1 .box_point{ display: flex; justify-content: space-between; align-items: flex-start;}
#sec2 .box_flex1 .box_point .img{ width: 700px;}
#sec2 .box_flex1 .box_point .inner{ width: 350px;}
#sec2 .box_flex1 .box_point .inner h3{ text-align: left;}
#sec2 .box_point{ margin: 0 0 80px;}
#sec2 .box_point h3{ font-size: 26px; line-height: 1.8; color: #286c35; padding: 10px 0 15px; text-align: center;}
#sec2 .box_point h3 span{ font-size: 15px;}
#sec2 .box_point p{font-size: 15px; line-height: 2; text-align: left;}

@media screen and (max-width: 600px) {
#sec2{ padding: 40px 0 0;}
#sec2 h2{ font-size: 20px; line-height: 1.5; padding: 0 0 15px;}
#sec2 p{ font-size: 14px; line-height: 1.7; padding: 0 4%; text-align: left;}
#sec2 .box_flex2,
#sec2 .box_flex3{ width: 92%; flex-direction: column;}
#sec2 .box_flex2{ padding: 30px 0 0;}
#sec2 .box_flex2 .box_point{ width: 100%;}
#sec2 .box_flex2 .box_point p{ padding: 0;}
#sec2 .box_flex3 .box_point{ width: 100%;}
#sec2 .box_flex3 .box_point .img{ width: 100%; height: auto;}
#sec2 .box_flex3 .box_point h3{ font-size: 20px;}
#sec2 .box_flex3 .box_point p{ padding: 0;}
#sec2 .box_flex1{ width: 100%;}
#sec2 .box_flex1 .box_point{ flex-direction: column;}
#sec2 .box_flex1 .box_point .img{ width: 92%; margin: 0 auto;}
#sec2 .box_flex1 .box_point .inner{ width: 100%;}
#sec2 .box_flex1 .box_point .inner h3{ text-align: center;}
#sec2 .box_point{ margin: 0 0 40px;}
#sec2 .box_point h3{ font-size: 20px; line-height: 1.5; padding: 10px 0 10px; text-align: center;}
#sec2 .box_point h3 span{ font-size: 13px;}
#sec2 .box_point p{font-size: 14px; line-height: 1.7; text-align: left;}
}