/* Service */
section.service_head {
 background:url("/images/bg_service_head.avif") no-repeat 0 0 / cover;
 overflow:hidden;
}
.service_head .btns {
 margin-bottom:120px;
}
.service_head .bg_round {
 box-shadow:#ff671499 0 0 100px;
}
.service_head .problem_list li,
.service_head .dots i {
 box-shadow:#ff710d 0 0 8px;
}
.how_list.si_list > li {
 flex-direction:column;
 gap:56px;
}
.how_list.si_list .flex {
 gap:90px;
 width:100%;
}
.si_portfolio_list {
 width:100%;
}
.si_portfolio_list .tit {
 position:relative;
 font-size:20px;
 color:#fff;
 font-weight:500;
 line-height:1.6;
 padding-left:10px;
 margin-bottom:16px;
}
.si_portfolio_list .tit:before {
 content:"";
 position:absolute;
 top:12px;
 left:0;
 width:4px;
 height:4px;
 background:#ffffff4d;
 border-radius:50%;
}
.si_portfolio_list .tit .btn_more {
 position:absolute;
 top:50%;
 right:0;
 font-size:16px;
 color:#fff;
 font-weight:600;
 line-height:30px;
 height:26px;
 transform:translateY(-50%);
 padding-right:26px;
 background:url("/images/arrow_more2.svg") no-repeat 100% 50%;
}
.si_portfolio_list ul {
 display:flex;
 gap:22px;
}
.infopage_how .si_portfolio_list li {
 width:calc((100% - 44px) / 3);
}
.infopage_how .si_portfolio_list li a {
 position:relative;
 display:flex;
 width:100%;
 border-radius:8px;
 overflow:hidden;
 border:#fff3 1px solid;
}
.infopage_how .si_portfolio_list li a .imgfit {
 width:140px;
 aspect-ratio:1/1;
 border-radius:0;
}
.infopage_how .si_portfolio_list li .txt {
 width:calc(100% - 140px);
 padding:28px 24px;
 display:flex;
 flex-direction:column;
 gap:4px;
}
.infopage_how .si_portfolio_list li .txt:before {
 display:none !important;
}
.infopage_how .si_portfolio_list li .type {
 font-size:14px;
 color:#ff710d;
 font-weight:500;
 line-height:1.7;
 letter-spacing:-0.42px;
}
.infopage_how .si_portfolio_list li .name {
 font-size:20px;
 color:#fff;
 font-weight:600;
 line-height:1.4;
 letter-spacing:-0.6px;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:normal;
 word-wrap:break-word;
 display:-webkit-box;
 -webkit-box-orient:vertical;
 -webkit-line-clamp:2;
}
section.service_faq {
 background:#040404;
 padding:120px 0 200px;
}
.service_faq .faq_list {
 margin-top:56px;
}
.service_faq .faq_list > li {
 border-bottom:#ffffff33 1px solid;
 padding:0 40px;
 transition:
 border-radius 0.2s linear,
 background 0.2s linear;
}
.service_faq .faq_list > li:first-child {
 border-top:#ffffff33 1px solid;
}
.service_faq .faq_list h3 button {
 position:relative;
 font-size:20px;
 color:#fff;
 font-weight:500;
 line-height:1.6;
 padding:30px 32px 30px 41px;
 display:block;
 text-align:left;
 width:100%;
 white-space:normal;
 letter-spacing:-0.6px;
}
.service_faq .faq_list h3 button:before {
 content:"Q";
 position:absolute;
 top:30px;
 left:0;
 font-size:22px;
 color:#fff6;
 font-weight:500;
 transition:0.2s linear;
}
.service_faq .faq_list h3 button:after {
 content:"";
 position:absolute;
 top:0;
 right:0;
 width:32px;
 height:100%;
 background:url("/images/arrow_faq.svg") no-repeat 50% 50%;
 transition:0.2s linear;
}
.service_faq .faq_list .con {
 border-top:#ffffff1d 1px solid;
 padding:24px 0 30px;
 font-size:17px;
 color:#cdd1d5;
 line-height:1.65;
 letter-spacing:-0.51px;
 display:none;
}
.service_faq .faq_list .con strong {
 color:#ffffffe6;
 font-weight:600;
}
.service_faq .faq_list .con p {
 font-size:inherit;
 color:inherit;
}
.service_faq .faq_list .con li {
 position:relative;
 padding-left:22px;
}
.service_faq .faq_list .con li:before {
 content:"";
 position:absolute;
 top:12px;
 left:8px;
 width:4px;
 height:4px;
 background:#fff;
 border-radius:50%;
}
.service_faq .faq_list > li.on {
 background:#ffffff1a;
 border-radius:8px;
 border-color:transparent;
}
.service_faq .faq_list > li.on_before {
 border-bottom-color:#040404;
}
.service_faq .faq_list > li.on h3 button:before {
 color:#0169d8;
}
.service_faq .faq_list > li.on h3 button:after {
 transform:rotate(180deg);
}
.service_faq .faq_list > li.faq_empty p {
 color:#fff;
 text-align:center;
 padding:20px 0;
}
.how_step_list {
 display:flex;
 gap:60px;
 margin-top:56px;
}
.how_step_list > li {
 position:relative;
 width:calc((100% - 120px) / 3);
 border-radius:8px;
 background:#ffffff14;
 padding:40px;
 transition:
 background 0.4s linear,
 box-shadow 0.4s linear !important;
}
.how_step_list > li:before {
 content:"";
 display:block;
 width:40px;
 aspect-ratio:1/1;
 background-repeat:no-repeat;
 background-position:50% 50%;
 background-size:contain;
 margin-bottom:26px;
}
.how_step_list > li + li:after {
 content:"";
 position:absolute;
 top:0;
 left:-60px;
 width:60px;
 height:100%;
 background:url("/images/arrow_step.svg") no-repeat 50% 50%;
}
.how_step_list > li span {
 display:block;
 font-size:14px;
 color:#ff710d;
 font-weight:500;
 line-height:28px;
 height:28px;
 width:76px;
 text-align:center;
 background:#ffffff1a;
 border-radius:15px;
 letter-spacing:-0.42px;
}
.how_step_list > li h3 {
 display:block;
 font-size:24px;
 color:#fff;
 font-weight:600;
 line-height:1.4;
 margin:18px 0 12px;
 letter-spacing:-0.72px;
}
.how_step_list > li li {
 position:relative;
 font-size:17px;
 color:#ffffffb3;
 line-height:1.65;
 padding-left:10px;
 letter-spacing:-0.51px;
}
.how_step_list > li li:before {
 content:"";
 position:absolute;
 top:12px;
 left:0;
 width:4px;
 aspect-ratio:1/1;
 border-radius:50%;
 background:#ffffff4d;
}
.how_step_list > li.i_c1:before {
 background-image:url("/images/icon_how_step_list01.svg");
}
.how_step_list > li.i_c2:before {
 background-image:url("/images/icon_how_step_list02.svg");
}
.how_step_list > li.i_c3:before {
 background-image:url("/images/icon_how_step_list03.svg");
}
.how_step_list > li.i_c3 span {
 color:#ff710d;
 background:#ffffff14;
 border:none;
}
.how_step_list > li.on {
 background:#0000001a;
 box-shadow:#ff710d 0 0 8px;
}
a.btn_slim {
 display:block;
 font-size:16px;
 color:#fff;
 font-weight:600;
 line-height:42px;
 height:44px;
 width:140px;
 text-align:center;
 border:#fff 1px solid;
 border-radius:22px;
 margin-top:40px;
}

/* ------------------------------ PC Guide ------------------------------ */
@media screen and (max-width:1520px){
/* Service */
	.service_head .btns {margin-bottom:100px;}
	.how_list.si_list > li {gap:50px;}
	.how_list.si_list .flex {gap:40px;}
	section.service_faq {padding:100px 0 160px;}
	.service_faq .faq_list {margin-top:50px;}
	.how_step_list {gap:40px; margin-top:50px;}
	.how_step_list > li {width:calc((100% - 80px)/3); padding:30px;}
	.how_step_list > li:before {margin-bottom:22px;}
	.how_step_list > li + li:after {left:-40px; width:40px;}
	.how_step_list > li span {font-size:13px;}
	.how_step_list > li h3 {font-size:22px; margin:18px 0 12px;}
	.how_step_list > li li {font-size:16px;}
	.how_step_list > li li:before {top:10px;}
}

/* ------------------------------ PC Guide ------------------------------ */
@media screen and (max-width:1280px){
}

/* ------------------------------ Tablet PC ------------------------------ */
@media screen and (max-width:1023px){
/* Service */
	.service_head .btns {margin-bottom:80px;}
	.how_list.si_list > li {gap:40px;}
	.how_list.si_list .flex {gap:20px;}
	.si_portfolio_list .tit {font-size:18px;}
	.si_portfolio_list .tit:before {top:10px;}
	.si_portfolio_list .tit .btn_more {font-size:14px;}
	.si_portfolio_list ul {gap:10px;}
	.si_portfolio_list li {width:calc((100% - 50px)/6);}
	.infopage_how .si_portfolio_list li {width:calc(50% - 5px);}
	.infopage_how .si_portfolio_list li:nth-child(3) {display:none;}
	section.service_faq {padding:80px 0 120px;}
	.service_faq .faq_list {margin-top:40px;}
	.service_faq .faq_list > li {padding:0 20px;}
	.service_faq .faq_list h3 button {font-size:18px; padding:20px 30px 20px 30px;}
	.service_faq .faq_list h3 button:before {top:20px; font-size:18px;}
	.service_faq .faq_list h3 button:after {width:30px;}
	.service_faq .faq_list .con {padding:20px 0; font-size:15px;}
	.service_faq .faq_list .con li {padding-left:20px;}
	.service_faq .faq_list .con li:before {top:10px; left:6px;}
	.service_faq .faq_list > li.faq_empty p {font-size:16px;}
	.how_step_list {gap:30px; margin-top:40px;}
	.how_step_list > li {width:calc((100% - 60px)/3); padding:20px;}
	.how_step_list > li:before {width:30px; margin-bottom:15px;}
	.how_step_list > li + li:after {left:-30px; width:30px;}
	.how_step_list > li span {font-size:12px; line-height:24px; height:24px; width:70px;}
	.how_step_list > li h3 {font-size:18px; margin:14px 0 10px;}
	.how_step_list > li li {font-size:14px; padding-left:8px;}
	.how_step_list > li li:before {top:9px;}
	a.btn_slim {font-size:14px; line-height:38px; height:40px; width:120px; margin-top:30px;}
}

/* ------------------------------ Mobile ------------------------------ */
@media screen and (max-width:767px){
/* Service */
	.service_head .btns {margin-bottom:60px;}
	.how_list.si_list > li {gap:30px;}
	.how_list.si_list .flex {flex-direction:column;}
	.si_portfolio_list .tit {font-size:15px; padding-left:10px; margin-bottom:16px;}
	.si_portfolio_list .tit .btn_more {font-size:13px; padding-right:20px; background-size:16px;}
	.si_portfolio_list ul {flex-direction:column;}
	.si_portfolio_list li {width:100%;}
	.infopage_how .si_portfolio_list li {width:100%;}
	.infopage_how .si_portfolio_list li:nth-child(3) {display:block;}
	.infopage_how .si_portfolio_list li a .imgfit {width:100px;}
	.infopage_how .si_portfolio_list li .txt {width:calc(100% - 100px); padding:20px; align-items:flex-start;}
	.infopage_how .si_portfolio_list li .type {font-size:13px;}
	.infopage_how .si_portfolio_list li .name {font-size:15px;}
	section.service_faq {padding:60px 0 80px;}
	section.service_faq.blog_faq_wrap {padding:40px 0 40px;}
	section.service_faq.blog_faq_wrap .inner {padding:0;}
	.service_faq .faq_list {margin-top:0;}
	.service_faq .faq_list h3 button {font-size:15px; padding:15px 30px 15px 24px;}
	.service_faq .faq_list h3 button:before {top:15px; font-size:15px;}
	.service_faq .faq_list h3 button:after {width:20px; background-size:contain;}
	.service_faq .faq_list .con {padding:15px 0; font-size:13px;}
	.service_faq .faq_list .con li {padding-left:12px;}
	.service_faq .faq_list .con li:before {top:8px; left:2px;}
	.service_faq .faq_list > li.faq_empty p {font-size:14px;}
	.how_step_list {flex-direction:column; margin-top:30px;}
	.how_step_list > li {width:100%;}
	.how_step_list > li:before {margin-bottom:10px;}
	.how_step_list > li + li:after {left:50%; top:-30px; height:30px; transform:translateX(-50%) rotate(90deg);}
	.how_step_list > li span {font-size:11px; line-height:20px; height:20px; width:60px;}
	.how_step_list > li h3 {font-size:16px; margin:12px 0 8px;}
	.how_step_list > li li {font-size:13px; padding-left:6px;}
	.how_step_list > li li:before {top:8px;}
	a.btn_slim {font-size:13px; line-height:28px; height:30px; width:80px; margin-top:15px;}
}