﻿.program-detail {padding:8vw 0 0 0;}
.program-detail .detail-box {display:flex;justify-content:space-between;flex-wrap:wrap;}
.program-detail .detail-box .img-part {width:38%;}
.program-detail .detail-box .img-part .large {display:flex;}
.program-detail .detail-box .img-part .large img {display:block;max-width:100%;}
.program-detail .detail-box .txt-part {width:58%;position:relative;}
.program-detail .detail-box .txt-part p {font-size:16px;line-height:1.5em;}
.program-detail .detail-box .txt-part p.location {padding:1em 0;font-size:16px;color:#555;padding-left:40px;position:relative;}
.program-detail .detail-box .txt-part p.location span {position:absolute;left:0;font-size:1.2em;}
.program-detail .detail-box .txt-part div.brand-title {font-size:18px;line-height:1.5em;color:#666;}
.program-detail .detail-box .txt-part h6 {font-size:20px;font-weight:normal;line-height:1.6em;position:absolute;bottom:0;left:0;right:90px;}
.program-detail .detail-box .txt-part h1 {font-size:20px;line-height:1.5em;font-weight:normal;}
.program-detail .detail-box .txt-part h1.spe {font-size:26px;border-bottom:1px solid #ccc;padding-bottom:15px;margin-bottom:20px;font-weight:600;}

.detail-img-list { }
.detail-img-list .alanscrollH { position: relative; overflow: hidden; width: 100%; }
.detail-img-list .alanscrollH .scrollBody { position: relative; }
.detail-img-list .alanscrollH .list-box { width: fit-content; flex-wrap: nowrap; padding-bottom: 10px; justify-content: unset; display: flex; }
.detail-img-list .alanscrollH .list-box .item { margin-left: 30px; height:320px;}
.detail-img-list .alanscrollH .list-box .item img {height:320px; display: block; user-select: none; }
.detail-img-list .alanscrollH .list-box .item:first-child { margin-left: 0 !important; }

.swappart-program { padding:20px 0 8vw 0; }
.swappart-program .swap-item { }
.swappart-program .swap-item .swap-title { border-bottom: 1px solid #000; padding: 20px 0; font-size: 24px; line-height: 1.02em; position: relative; background: url('/images/icons/arraw-right-line.png') left center no-repeat; background-position-x: -35px; transition: all .2s; }
.swappart-program .swap-item .swap-content { display: none; }
.swappart-program .swap-item:hover .swap-title { color: #333; background-position-x: 0px; text-indent:35px; }
.swappart-program .swap-item.hover .swap-title { background-position-x: 0px; text-indent:35px; }
.swappart-program .swap-item.hover .swap-content { display: block; }

/*images*/
.swap-content-images { flex-wrap: wrap; padding: 30px 0; display: flex; justify-content: space-between; }
.swap-content-images::after { content: ''; flex-grow: 99999999; }
.swap-content-images .img { width:24%; margin-top: 1.333%; overflow: hidden; transition: all .3s; }
.swap-content-images img { width: 100%; display: block; cursor:pointer; }

/*swap-content-products*/
.swap-content-products { flex-wrap: wrap; gap: 10px; padding:30px 0; justify-content: space-between; display: flex; }
.swap-content-products .item {display:block; width:18%; background: #fff; margin-bottom: 20px; box-shadow: rgba(0,0,0,0.4) 0 0 0px; transition: all .3s; }
.swap-content-products .item .img { filter: brightness(0.95); background: #fff; display: flex; align-items: self-end; }
.swap-content-products .item .img img { width: 100%; display: block; margin: 0 auto; }
.swap-content-products .item .title {font-size:14px; line-height:1.4em; padding:0.5em 0;}
/*.swap-content-products .item:hover { box-shadow: rgba(0,0,0,0.4) 0 0 5px; }*/

/*materials*/
.swap-content-materials { flex-wrap: wrap; padding: 50px 0; justify-content: space-between; display: flex; }
.swap-content-materials::after { flex-grow: 100000; }
.swap-content-materials .item { width: 15.5%; overflow: hidden; transition: all .3s; align-self: flex-end; margin-bottom: 20px; }
.swap-content-materials img { width: 100%; display: block; }
.swap-content-materials .item .txt { }
.swap-content-materials .item:hover { transform: scale(1.05); }
/*resources*/
.swap-content-resources { padding: 50px 0; display: flex; flex-wrap: wrap; justify-content: space-between; }
.swap-content-resources .file-name { display: inline-block; margin: 10px 0px; font-size: 18px; min-width: 15.5%; }
.swap-content-resources .file-name .aicf {margin-right:5px;}

.testimonial-txt {width:fit-content;position:relative;padding:30px;padding-right:50px;padding-bottom:50px;font-weight:600;}
.testimonial-txt>em {font-style:normal;font-weight:bold;}
.testimonial-txt .customer-name {position:absolute;right:0px;bottom:0;line-height:30px;}

.swap-content-testimonies .item { padding:15px 20px; margin: 20px 0; border: 1px solid #ddd;border-radius:5px; position: relative; display:flex;flex-wrap:wrap;justify-content:space-between;}
.swap-content-testimonies .item > .name { font-size:24px;align-content:center;width:fit-content;}
.swap-content-testimonies .item > .position { font-size:18px; align-content:center;width:55%;color:gray;}
.swap-content-testimonies .item > .time { font-size:16px; align-content:center; color: #999; width:fit-content;}
.swap-content-testimonies .item > .txt { padding: 10px 0; line-height:1.5em; font-size: 18px;width:100%;border-top:1px solid #eee;margin-top:10px;color:#444;}

@media only screen and (max-width:1640px) {
	.detail-img-list .alanscrollH .list-box .item {height:20vw; margin-left:1vw; }
	.detail-img-list .alanscrollH .list-box .item img {height:20vw; }

	.swappart-program .swap-item .swap-title {padding:1.4vw 0; font-size:1.5vw;}

	/*images*/
	.swap-content-images {padding:3vw 0;}

	/*swap-content-products*/
	.swap-content-products {gap:0.6vw; padding:3vw 0;}
	.swap-content-products .item {margin-bottom:1.2vw;}


	/*materials*/
	.swap-content-materials {padding:3vw 0;}
	.swap-content-materials .item {margin-bottom: 1.2vw; }
	/*resources*/
	.swap-content-resources { padding:3vw 0;}
	.swap-content-resources .file-name {margin:0.6vw 0; font-size:1.1vw; }


	.customer-review .txt-part {padding-bottom:15.6vw; }
	.customer-review .txt-part .txt-abs {font-size:2.2vw;}
	.customer-review .txt-part > h5.title { font-size:4.5vw;line-height:5vw; }
	.customer-review .txt-part > .msg-info { padding:1.2vw;margin:1.2vw 0;padding-left:6vw;min-height:6vw; }
	.customer-review .txt-part > .msg-info .head-img { width:3.8vw; height:3.8vw;border-radius:3.8vw;top:1.2vw;left:1.2vw;}
	.customer-review .txt-part > .msg-info h6 { font-size:1.1vw; }
	.customer-review .txt-part > .msg-info .time { font-size:0.9vw;}
	.customer-review .txt-part > .msg-info .txt { font-size:0.9vw; }
}
@media only screen and (max-width:1280px){
	.swap-content-materials .item { width:19%;}
}
@media only screen and (max-width:1080px) {
	.program-detail .detail-box .txt-part h1 {padding-bottom:0.8vw;line-height:1em;font-size:22px;}
	.program-detail .detail-box .txt-part p.location {padding-left:24px;}
	.program-detail .detail-box .txt-part h6 {line-height:1.2em;font-size:18px;}
	.program-detail .detail-box .txt-part div.brand-title {font-size:18px;}
	.program-detail .detail-box .txt-part p.location {font-size:14px;}

	.swappart-program .swap-item .swap-title {font-size:32px;padding:16px 0;background-size:24px 24px;}
	.swappart-program .swap-item:hover .swap-title,.swappart-program .swap-item.hover .swap-title {text-indent:40px;}


	.swap-content-materials .item { width:24%;}
	/*resources*/
	.swap-content-resources { padding:30px 0;}
	.swap-content-resources .file-name {margin:5px 0; font-size:14px; min-width:24%; }
}
@media only screen and (max-width:768px) {
	.program-detail .detail-box .txt-part p {font-size:12px;}

	.swap-content-products .item {width:32%;}

	.swappart-program .swap-item .swap-title {font-size:22px;padding:10px 0;background-size:16px 16px;}
	.swappart-program .swap-item:hover .swap-title,.swappart-program .swap-item.hover .swap-title {text-indent:24px;}


	.detail-img-list .alanscrollH .list-box .item {height:150px;}
	.detail-img-list .alanscrollH .list-box .item img {height:150px;}

	.swap-content-resources { padding:20px 0;}
	.swap-content-resources .file-name {min-width:32%; }

	.swap-content-materials .item { width:33%;}

	.swap-content-testimonies .item > .name { font-size:20px;}
	.swap-content-testimonies .item > .position { font-size:16px;}
	.swap-content-testimonies .item > .time { font-size:14px;}
	.swap-content-testimonies .item > .txt {font-size:14px;}
}
@media only screen and (max-width:560px) {
	.program-detail .detail-box {display:block;}
	.program-detail .detail-box>div {width:100% !important;}
	.program-detail .detail-box .img-part .large img {margin:0 auto;}
	.program-detail .detail-box .txt-part {margin-top:20px;padding-bottom:0;}
	.program-detail .detail-box .txt-part div.brand-title {font-size:16px;}
	.program-detail .detail-box .txt-part h1 {font-size:20px;}
	.program-detail .detail-box .txt-part h6 {font-size:14px;padding:20px 0;position:relative;font-weight:bold;}

	.swap-content-images .img {width:49%;margin-top:2%;}

	.swap-content-products .item {width:49%;}

	.swap-content-materials .item { width:49%;}

	.swap-content-resources { padding:15px 0;}
	.swap-content-resources .file-name {min-width:49%; }

	.swap-content-testimonies .item { padding:15px 10px;position:relative;}
	.swap-content-testimonies .item > .name { font-size:20px;width:100%;line-height:2em;}
	.swap-content-testimonies .item > .position { font-size:16px;width:100%;}
	.swap-content-testimonies .item > .time { font-size:14px;position:absolute;right:10px;line-height:40px;}
}