@charset "utf-8";

.w-p10 {width:10%!important;}
.w-p20 {width:20%!important;}
.w-p25 {width:25%!important;}
.w-p30 {width:30%!important;}
.w-p33 {width:33.33%!important;}
.w-p40 {width:40%!important;}
.w-p50 {width:50%!important;}
.w-p60 {width:60%!important;}
.w-p80 {width:80%!important;}
.m-150 { margin-top:150px;}

.banner{position: relative; padding-top: 100px; overflow: hidden; }
.banner img{ display: block; width: 100%;}
.banner img.mobile{ display: none;}
.banner_tit{ position: absolute; top: 50%; margin-top: -10px; left: 0; width: 100%; text-align: center;}
.banner_tit h1{ font-size: 48px; line-height:1; font-weight:bold; padding-bottom:20px; color:#ffffff; }
.banner_tit h2{ font-size: 24px; line-height:1; color: #00a551; font-family: 'ITCAVANTGARDESTD-BK', Arial, sans-serif; text-transform:uppercase;}


.page_vela { padding: 50px 0; background: #f7f7f7; transition: .15s linear; -moz-transition: .15s linear; -webkit-transition: .15s linear; }
.page_vela .inner { position: relative; }
.page_vela .banner_tit { float: right; width: 45%; right: 0px; left: auto; margin-left: 10px; text-align: left; transition: .15s linear; -moz-transition: .15s linear; -webkit-transition: .15s linear; height: auto; transform: translateY(-50%); }
.page_vela img { width: auto; float: left; max-width: 50%; margin-right: 30px; transition: .15s linear; -moz-transition: .15s linear; -webkit-transition: .15s linear; vertical-align: middle; display: block; }
.page_vela .banner_tit h1 { color: #00a551; }
.page_vela .banner_tit p { color: #333333; font-size: 26px; line-height: 1; padding-bottom: 36px; }


.vela-list li { width:100%; padding-bottom: 75px; background-color: #f1f7f7; }
.vela-list li:nth-child(2n) { background-color: #ffffff; }
.vela-list h1 { color: #00a551; font-size: 38px; font-weight: lighter; line-height: 1.5; padding-top: 75px; padding-bottom: 20px; text-align: center; }
.vela-list p { padding-bottom: 30px; height: 56px; line-height: 2; font-size: 14px; font-weight: lighter; color: #666666; }
.vela-list li .vela_btn { padding: 0 30px; margin: auto; width: 90px; height: 50px; line-height: 50px; text-align: left; color:#333333; font-size: 16px; border: #d8dede solid 1px; border-radius: 25px; background-image:url(../images/btn_icon.png); background-repeat: no-repeat; background-position: 80% center;transition: .15s linear; -moz-transition: .15s linear; -webkit-transition: .15s linear; }
.vela-list li:hover .vela_btn { background-image: url(../images/btn_icon1.png); background-color: #00a551; color:#ffffff; border:#00a551 solid 1px; }
.vela-list li .vela_l { float: left; padding-left: 10px; transition: .15s linear; -moz-transition: .15s linear; -webkit-transition: .15s linear; font-size: 0; }
.vela-list li:nth-child(2n) .vela_l { float: right; padding-left: 0; padding-right: 10px; }
.vela-list li .vela_r { float: right; padding-right: 10px; width: 500px; transition: .15s linear; -moz-transition: .15s linear; -webkit-transition: .15s linear; }
.vela-list li:nth-child(2n) .vela_r { float: left; padding-right: 0; padding-left: 10px; }
.vela-list li .vela_r-item { position: relative; float: left; margin-top: 158px; width: 33.333%; text-align: center; }
.vela-list li .vela_r-item::before { content: " "; position: absolute; right: 0; top: 50%; margin-top: -32px; width: 1px; height: 64px; background-color: #D2D2D2; }
.vela-list li .vela_r-item dt { margin-bottom: 20px; line-height: 1; font-size: 32px; font-weight: bold; color: #00a551; }
.vela-list li .vela_r-item dd { margin: 0; line-height: 2; font-size: 14px; font-weight: lighter; color: #666666; }
.vela-list li:hover .vela_l { padding-left: 0px; }
.vela-list li:hover .vela_r { padding-right: 0px; }
.vela-list li:nth-child(2n):hover .vela_l { padding-right: 0; }
.vela-list li:nth-child(2n):hover .vela_r { padding-left: 0; }


.v-tit { display: inline-block; padding: 0 10px; margin-bottom: 20px; background-color: #009143; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; line-height: 32px; font-size: 14px; color: #ffffff; }
.v-txt {line-height: 2;font-size: 14px;color: #666666;}


.vela-details { text-align: center; padding-top: 60px; }
.vela-details h1 { font-size: 18px; color: #333333; line-height: 1.5; padding-bottom: 45px; border-bottom: #eee solid 1px; }
.vela-details p { font-size: 14px; color: #666666; line-height: 2; padding-top: 30px; padding-bottom: 50px; }
.vela-details-tab { padding-bottom: 50px; background-image: url(../images/velabg.jpg); background-repeat: no-repeat; background-position: top center; background-size: 100% auto; background-color: #f7f7f7; position: relative; }
.vela-details-menu { width: 75%; margin: 0 auto; padding-top: 156px; position: relative; z-index: 2; }
.vela-details-menu ul{display: flex; align-items: center;justify-content: center;}
.vela-details-menu li {position: relative;padding-bottom: 22px;padding-right: 130px;display: block;cursor: pointer;width: 150px;text-align: center;color: #ffffff;}
.vela-details-menu li:last-child { padding-right: 0; }
.vela-details-menu li h1 { font-weight: bold; font-size: 20px; line-height: 1; }
.vela-details-menu li p { font-family: 'ITCAVANTGARDESTD-BK', Arial, sans-serif; font-size: 12px; color: #ffffff; padding-top: 6px; line-height: 1; }
.vela-details-menu li span { display: none; width: 150px; height: 4px; position: absolute; bottom: -4px; left: 0; background: #00a551; }
.vela-details-menu li.hover span { display: block; }
.vela-details-box { clear: both; background: #ffffff; border-radius: 8px; padding-top: 50px; padding-bottom: 25px; }
.table-box1 { width: 90.5%; margin: 0 auto; font-size: 0; text-align: center; }
.table-box1 table { width: 100%; border-right: 1px solid #ebeef5; border-bottom: 1px solid #ebeef5; box-sizing: border-box; }
.table-box1 table td, 
.table-box1 table th { border-left: 1px solid #ebeef5; border-top: 1px solid #ebeef5; font-size: 14px; box-sizing: border-box; }
.table-box1 table th { width: 33.333%; height: 70px; background-color: #E8E8E8; font-size: 18px; text-align: center; color: #333333; }
.table-box1 table tr { background-color: #F7F7F7; }
.table-box1 table tr:nth-child(2n) { background-color: #ffffff; }
.table-box1 table td { width: 33.333%; height: 50px; font-size: 14px; text-align: center; color: #333333; }
.table-box2 { width: 90.5%; margin: 0 auto; font-size: 0; text-align: center; }
.table-box2 table { width: 100%; border-right: 1px solid #ebeef5; border-bottom: 1px solid #ebeef5; box-sizing: border-box; }
.table-box2 table td, 
.table-box2 table th { border-left: 1px solid #ebeef5; border-top: 1px solid #ebeef5; font-size: 14px; box-sizing: border-box; }
.table-box2 table th { width: 50%; height: 70px; background-color: #E8E8E8; font-size: 18px; text-align: center; color: #333333; }
.table-box2 table tr { background-color: #F7F7F7; }
.table-box2 table tr:nth-child(2n) { background-color: #ffffff; }
.table-box2 table td { width: 50%; height: 50px; font-size: 14px; text-align: center; color: #333333; }
.table-box1 p {color: #777; font-size: 14px; line-height: 30px; text-align: left;}

@media screen and (max-width: 1024px) {
    .banner{ padding-top:50px;}
    .banner img.pc{ display:none;}
	.banner img.mobile{ display:block;}
	.banner_tit{ top:50%; margin-top:-10px; left:0; width:100%; text-align:center;}
	.banner_tit h1{ font-size:2.7rem;padding-bottom:10px;}
    .banner_tit h2{ font-size:1.3rem; }


    .vela-list li { padding-bottom: 40px; }
    .vela-list h1 { font-size: 2.4rem; padding-bottom: 10px; padding-top: 60px; }
    .vela-list p { padding-bottom: 0; height: auto; }
    .vela-list li .vela_btn { margin: 20px auto 25px; width: 70px; padding: 0 20px; height: 40px; line-height: 40px; font-size: 1.3rem; }
    .vela-list li .vela_l { padding: 0 !important; width: 100% !important; }
    .vela-list li .vela_l img { width: 100%; }
    .vela-list li .vela_r { padding: 0 !important; width: 100%; }
    .vela-list li .vela_r-item {  margin-top: 65px; }
    .vela-list li .vela_r-item::before { display: none; }


    .page_vela { padding: 30px 0; text-align:center; }
	.page_vela img { max-width:100%; padding-top:30px; }
	.page_vela .banner_tit { width: 100%; text-align: center; position: static; margin-top: 0; transform: translateY(0%); }
    .page_vela .banner_tit h1 { padding-bottom: 10px; font-size: 2.7rem; }
    .page_vela .banner_tit p { padding-bottom: 10px; font-size: 1.8rem; }
    

    .vela-details { text-align: center; padding-top: 20px; }
    .vela-details-tab { background-image: url(../images/velabg2.jpg); }
    .vela-details h1 { font-size: 1.4rem; line-height: 2; padding-bottom: 20px; }
    .vela-details p { font-size: 1.2rem; padding-top: 15px; padding-bottom: 25px; }
    .vela-details-menu { width: 310px; padding-top: 100px; }
    .vela-details-menu li { padding-bottom: 10px; padding-right: 50px; width: 130px; }
    .vela-details-menu li h1 { font-size: 1.8rem; }
    .vela-details-menu li p { font-size: 1.4rem; }
    .vela-details-menu li span { width: 130px; }

    .vela-details-box { padding-top: 30px; padding-bottom: 20px; }

    .table-box1 table th { height: 40px; font-size: 1.4rem; }
    .table-box1 table td { height: 40px; font-size: 1.2rem; }
    .table-box2 table th { height: 40px; font-size: 1.4rem; }
    .table-box2 table td { height: 40px; font-size: 1.2rem; }

}