.W_in { max-width:1460px; }

section { position: relative; padding: 8% 0; text-align: left;}
section h1 { font-size:clamp(2.6rem, 5.385vw, 4.2rem); margin-top: 0;  }
section p { margin-top: 2vw; color:#4b5563; }
section button { margin-top:2em; }

#MainV { position: relative; background: #f3f4f6; padding: calc(100px + 8%) 0 8%;}
#MainV .Layer { align-items: center;}
#MainV .Layer img { width:90%; transform: scale(-1, 1);}

.Main_Text { position: absolute; top: 0; height: 100%; }
.Main_Text h2 { font-size:clamp(2rem, 3.385vw, 2.85rem); margin-bottom:20px; font-weight: normal;}
.Main_Text h1 { font-size:clamp(4rem, 6.385vw, 5.5rem); font-weight: 600; letter-spacing: -5px;margin:0; line-height: 1;}

section h1 { color:#1f2937; }
section h1 span{ color: #9ca3af; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;}

#section1 p { margin: 0.5vw 0; }
#section1 .Layer { margin-top: 3%; }
#section1 .Layer>li { border: 1px solid #ddd; border-radius: 20px; padding: 25px 30px;}
i.fas.iconBg  { display: flex; justify-content: center; align-items: center; width: 4rem; height: 4rem; border-radius:50%; --tw-bg-opacity: 1; background-color: rgba(79, 70, 229,.12);}
#section1>ul>li i:before { color: #4f46e5; font-size: 1.5rem;}
#section1>ul>li:nth-child(2) i { background-color: rgba(219, 39, 119,.12);}
#section1>ul>li:nth-child(2) i:before { color: #db2777;}
#section1>ul>li:nth-child(2) .fa-check:before { color: #db2777; }

#section1>ul>li:nth-child(3) i  { background-color: rgba(5, 150, 105,.12);}
#section1>ul>li:nth-child(3) i:before { color: #059669;}
#section1>ul>li:nth-child(3) .fa-check:before { color: #059669; }

#section1>ul>li:nth-child(4) i { background-color: rgba(124, 58, 237,.12);}
#section1>ul>li:nth-child(4) i:before { color: #7c3aed;}
#section1>ul>li:nth-child(4) .fa-check:before { color: #7c3aed; }

#section1>ul>li:nth-child(5) i { background-color: rgba(217, 119, 6,.12);}
#section1>ul>li:nth-child(5) i:before { color: #d97706;}
#section1>ul>li:nth-child(5) .fa-check:before { color: #d97706; }

#section1>ul>li:nth-child(6) i { background-color: rgba(37, 99, 235,.12);}
#section1>ul>li:nth-child(6) i:before { color: #2563eb;}
#section1>ul>li:nth-child(6) .fa-check:before { color: #2563eb; }

#section2,#section4 { background:#f3f4f6; }
#section2 .Layer.L2>li:nth-child(3),#section2 .Layer.L2>li:nth-child(4),#section4 .Layer.L2>li:nth-child(3),#section4 .Layer.L2>li:nth-child(4){ right: 7%;}
#section2>.Layer>li:first-child,#section4>.Layer>li:first-child { align-items: flex-start; padding-right: 10%;}

.Prod.Layer>li { height: clamp(230px, 23vw, 300px); 
	--tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); }
.Prod.Layer>li { cursor: pointer; overflow: hidden; border: 1px solid #eee; border-radius: 20px;}
.Prod.Layer figure { height: 68%; overflow: hidden;}
.Prod.Layer figure img { height: auto; }
.Prod dl { padding: 3% 7% 5%; }
.Prod.Layer dt { padding: 0px;}

.btn-more { position: relative; width: 100%; background: none; color: #764ba2; border: 1px solid #ccc; margin-top: 5%; padding: 15px 0 35px;}
.btn-more:hover { box-shadow: inset 0px 0px 10px 1px rgba(0,0,0,.05); background:#eee; }
.btn-more:before,.btn-more:after { content: ''; position: absolute; left: calc(50% - 9px); top: 1.7em; width: 18px; height: 18px; border-bottom: 2px solid #764ba2; border-right: 2px solid #764ba2; transform: rotate(45deg);}
.btn-more:after { top: 2.1em;}
#btnWrapper.off .btn-more { padding: 40px 0 10px; }
#btnWrapper.off .btn-more:before,#btnWrapper.off .btn-more:after { transform: rotate(-135deg) translateY(-1px); top:1.1em;}
#btnWrapper.off .btn-more:after { top:1.5em;}


#section3 p { text-align: left; }
#section3>.Layer>li { align-items: center;  }
#section3>.Layer>li:last-child { align-items: flex-start; }
#section3 .Prod.Layer>li { height: auto; border:0; --tw-shadow:none; box-shadow:none; }
#section3 .Prod.Layer>li:before { content:''; position: absolute; width: 100%; height: 100%; background:url('../img/phone.png') no-repeat center / contain ; overflow: hidden;}
#section3 .Prod.Layer>li:nth-child(2):before {background-image:url('../img/phone_r.png');}
#section3 .Prod img { padding: 27% 10.8% 0 11.3%; }

.fixed_bg { background-image: url('../img/fixed_bg.jpg'); margin:0; height:auto; }
.fixed_bg:before { background-color: rgba(255,255,255,.05); background-image: radial-gradient(rgba(64,89,50,.4) 40%, transparent 0), radial-gradient(rgba(64,89,50,.4) 40%, transparent 0); background-position: 0 0, 2px 2px; background-size: 4px 4px; backdrop-filter: blur(13px); background-blend-mode: soft-light;}
.fixed_bg h1 { color:#ffffff; }
.fixed_bg br {display:none; }
.fixed_bg h4 { color:#f5b172; padding-bottom:20px; }
.fixed_bg span { font-weight:normal; }
.fixed_bg h6 { color: #ddeeff;}
.fixed_bg p { color:#f5eea6; padding-top:20px; }

#section5 { display: flex; align-items: center; }
/*#section5:before { content:''; position:absolute; width:100%; height:100%; background:url('../img/contact.jpg')no-repeat center; padding:0; top:0; opacity: 0.3;}*/
#section5 img { height: 100%; }
#section5 input, #section5 select { height:6.5vh; width:100%; border-radius: 7px; font-size: 16px;}
#section5 div,#section5 button { margin-bottom:10px; margin-top: 0}

/* Footer */
footer { background: #111827; }
footer .FootNav  { border-top:0; border-color:#333; }
footer .FootNav a { color:#fff; }
footer address .copy p { color:#9ca3af }
footer .Family select { background: #ddd; border-radius: 7px; height: 36px;}


@media (max-width:1280px){/********** 1280(LCD) **********/
#MainV { padding: calc(100px + 8%) 0 8%; }
}


@media (max-width:1024px){/********** iPad Pro(Notebook) **********/
#MainV { padding: 8% 0; }
#section2 .Layer,#section4 .Layer { margin-top: 3%; }
#section2 .Layer.L2>li:nth-child(3), #section2 .Layer.L2>li:nth-child(4), #section4 .Layer.L2>li:nth-child(3), #section4 .Layer.L2>li:nth-child(4) { right: auto; }
#section5 li:last-child { width:calc(100% - ((100% - (1vw + 3%)*2)/3 + (1vw + 3%))); margin-right:0; }
}


@media (max-width:768px) {/********** iPad(Tablet) **********/
#MainV .Layer { align-items: end; }
#MainV .Layer>li:last-child { align-items: flex-end; justify-content: flex-end; }
section,#section3>.Layer>li:first-child { height:auto; }
section .btn_offset { position: absolute; right: 0; margin: 0; font-size: 1.2em;}
.mv_sec>.L2>li { width:100%;}
.mv_sec img { max-width:80%; margin:0 auto; }
#section3 .btn_offset,#section5 .btn_offset { position: relative; }
}


@media (max-width:480px) {/********** iPad(Tablet) **********/
footer .Family { top: 80px; }
}