@media screen and (min-width: 1025px) {
.lg-hide{display:block}
.sm-hide{display:none}
.xs-hide{display:none}
}
@media screen and (max-width: 1366px) {
section .h1{font-size:3em}
.s3 .video-slider-bar{bottom:20px}
.ans-imgbg{left:0}
.open-link-wrap{padding:0 0 0 100px}
.s2_2 .contents-center{width:90%}
.s2_1 .contents-center{width:90%}
.sub{text-align:center;font-size:2.5em;line-height:1.2;margin:0 auto}
.icon-img{width:30px;height:8px;background:#e2001a;-webkit-clip-path:polygon(15% 0,100% 0,85% 100%,0% 100%);clip-path:polygon(15% 0,100% 0,85% 100%,0% 100%)}
.s3 .dec-body{padding:30px 5px}
.s3 .dec-body .txt .list-txt li{font-size:1em;padding:0}
.s3 .article-title{font-size:1.6em;line-height:1.2;margin:5px 0 12px}
.s3 .content-1{width:62%}
.s3 .content-2{width:38%}
.s3 .dec-wrap{padding:20px 0}
}
@media screen and (min-width: 1199px) and (max-width: 1280px) {
.qa-final .ans-txt-number,.qa-final .ans-txt-title{font-size:4.6em}
.qa-final .ans-txt-sub{font-size:2.6em;line-height:1.6;padding:0}
.qa-final .ans-txt-dec{font-size:1.2em}
.open-link-wrap .open-link .open-txt-link{font-size:1.4em}
.qa-final .ans-txt-wrap{padding:0 0 0 80px}
.open-link-wrap{padding:0 0 0 80px}
.open-link-wrap .open-link{margin:20px 0}
.qa-final .shape-wrap{padding-left:60px}
.media{margin-top:0}
.s3 .content-1{width:57%}
.s3 .content-2{width:43%}
.s3 .dec-wrap{padding:0 0 0 15px}
}
@media screen and (max-width: 1024px) {
#pc_Build{font-size:70%;line-height:1.4}
.s2 .step-back{position:absolute;top:0;left:50px}
.btn-wrap{font-size:1.6em;margin:30px 0 10px;padding:8px 20px}
.top-header{height:auto}
.top-header .header .header-wrap{width:100%;margin:100px 0 0}
.header .title{width:50%}
.title{width:100%;max-width:940px}
.h1{font-size:3em;line-height:1.2}
.sub-txt{text-align:center;font-size:1.6em;line-height:1.4;color:#fff}
.s1 .title{width:100%;max-width:640px}
.whybuild .contents-center{width:90%;max-width:1170px;margin:0 auto;padding:8% 15px}
.whybuild .title{width:90%;max-width:640px}
.whybuild .sub-body .sub{font-size:2.6em}
.whybuild .sub-body .sub span{font-size:1em}
.whybuild .sub-body:nth-child(odd){padding-top:0}
.s1 > .block-header{width:100%;height:auto;padding:5% 0}
.s1 .the-parts{width:90%}
.s2 .contents-center{width:90%}
.s2 .block-header .title{width:60%;max-width:640px}
.s2 .qa{width:90%;max-width:1170px;margin:0 auto;text-align:center;position:relative}
.s2 .qa .alien-wrap{position:absolute;top:120px;left:0}
.s2 .qa .alien-01{width:30%}
.s2 .qa .alien-02{width:30%}
.s2 .qa .qa-question-txt{font-size:2.6em}
.link-txt{font-size:2.4em;line-height:1.4em}
.s2 .number{font-size:3em}
.qa-final .ans-txt-number,.qa-final .ans-txt-title{font-size:4.6em}
.qa-final .ans-txt-sub{font-size:2.6em;line-height:1.6;padding:0}
.qa-final .ans-txt-dec{font-size:1.2em}
.open-link-wrap .open-link .open-txt-link{font-size:1.4em}
.qa-final .ans-txt-wrap{padding:0 0 0 30px;width:100%;top:16%}
.open-link-wrap{padding:0 0 0 30px;top:45%}
.media .media-icon{font-size:1.6em;margin:0}
.open-link-wrap .open-link{border-spacing:0;height:50px;margin:10px 0}
.qa-final .shape-wrap{padding-left:15px;bottom:24%;left:0}
.txt2{width:100%;display:block;padding:0;vertical-align:middle}
.txt2 .h1{font-size:2.6em;line-height:1.2}
.txt2 .sub-txt{font-size:2em}
.s2_1 .block-header{width:90%}
.s2_1 .contents-center{padding:9% 0}
.s2_2 .contents-center{width:90%;padding:5% 0}
.s2_2{width:100%;margin:0 auto;height:700px}
.s2_2 .body{width:75%;margin:30px 0}
.s2_2 .alien-wrap{width:40%}
.s3 .block-header.header-bg{background:url(../images/title_bg_3_xs.jpg) no-repeat center center}
.s3 .block-header .title{width:50%}
.s3 .content-1{width:100%;max-width:768px;margin:0 auto;float:none}
.s3 .content-2{width:100%;float:none;height:auto;display:block;padding:0;overflow:auto;background-color:rgba(0,0,20,1)}
.s3 .youtub-video-wrap{padding:0 15px}
.s3 .slider-body{padding:0 15px}
.s3 .dec-wrap{padding:20px 15px;height:100%;width:100%;max-width:768px;margin:0 auto;overflow:hidden}
.s3 .content-2 > .img{float:left}
.s3 .content-2 > .img:after{content:"";clear:both;display:block}
.ebook-bg{background: url(https://asset.msi.com/event/mb/2017/pcBuild_landing/images/ebook-1_sm.jpg) no-repeat center center; padding: 0% 30px; background-size: cover; margin: 0 auto; padding-bottom: 35.18%; height: 0; } 

}
@media screen and (max-width: 960px) {
.lg-hide{display:none}
.sm-hide{display:none}
.xs-hide{display:block}
.whybuild .contents-center{padding:8% 15px}
.s2 .qa .qa-question-txt{text-align:left}
.s2 .qa-question-title{width:100%;text-align:center;padding:30px 0}
.s2 .qa .qa-ans-wrap{width:100%;max-width:480px;margin:0}
.qa-final .ans-txt-wrap{padding:0}
.qa-final .ans-txt-number,.qa-final .ans-txt-title{font-size:4em}
.qa-final .ans-txt-sub{font-size:2em;line-height:1.6;padding:0}
.qa-final .ans-txt-dec{font-size:1em}
.open-link-wrap .open-link .open-txt-link{font-size:1.2em}
.open-link-wrap{padding:0;top:43%}
.media .media-icon{font-size:1.4em;margin:0}
.gray-txt{font-size:1em;line-height:1.2;margin:5px 0}
.media{margin-top:0}
.qa-final .shape-wrap{padding-left:0;bottom:8.5%}
.qa-final-btn{display:block;position:absolute;right:0;bottom:4%;padding-right:0}
.qa-final .shape-wrap .shape-box{width:150px;height:30px}
.qa-final .shape-wrap .shape-box .txt{width:150px;height:30px;line-height:30px;font-size:1.2em}
.s1 .title{width:80%}
.s3 .content-1{width:90%}
.s3 .dec-wrap{width:90%}
}
@media screen and (max-width: 768px) {
#pc_Build{font-size:65%;line-height:1.4}
.s2_2 .case-body{padding:0 20px;color:#fff;line-height:1.6;background-color:transparent;padding:20px 20px;height:260px;overflow:auto;margin:20px 0}
.s2_2 .accordion > li > a{font-size:1.2em}
.s2_2 .alien-wrap img{max-width:60%}
.s2_1 .header-bg{padding-bottom:30%}
.s2_1 .contents-center{padding:8% 0}
.ebook-bg{background: url(../images/ebook-1_xs.jpg) no-repeat center center; padding: 0% 15px; background-size: cover; margin: 0 auto; padding-bottom: 61%; height: 0; } 
.ebook { padding: 15px; }
}
@media screen and (max-width: 736px) {
#pc_Build{font-size:65%;line-height:1.4}
.top-header .header .header-wrap{width:90%;margin:0 auto}
.h1{font-size:2.4em;line-height:1.2}
.sub{font-size:1.6em}
.sub-title{font-size:1.4em;line-height:1.2;margin:10px 0}
.btn-center{width:50%;margin:0}
section .h1{font-size:2em;line-height:1.2}
section .sub{font-size:1.6em}
section .btn-center{width:50%;margin:0}
#topnav a span{font-size:1em}
#topnav a{width:calc(100% / 3);padding:10px 0;font-size:1em}
#topnav .nav-box img{max-width:30px;max-height:30px}
.arrow p{font-size:1.6em;line-height:1.2}
.btn-wrap{font-size:1.2em;margin:10px 0;padding:4px 10px}
.btn-wrap-w{padding:4px 50px}
.link-txt{font-size:1.6em;line-height:1.2em}
.whybuild .sub-body .sub{font-size:1.6em}
.whybuild .sub-body:nth-child(odd){padding-top:0}
.whybuild .contents-center{width:90%;padding:15% 0 5%}
.sub-txt{text-align:center;font-size:1em;line-height:1.4;color:#fff}
.s2 .block-header .title{width:90%}
.s2 .block-header .txt{width:90%;padding:2% 0}
.s2 .qa .qa-ans-wrap li:before{font-size:.5em;line-height:30px}
.img-btn p{font-size:1em}
.s2 .contents-center{padding:3% 0}
.s2 .qa .qa-question-txt{font-size:1.8em;line-height:1.4;text-align:left}
.s2 .qa .qa-ans-wrap li{text-indent:-40px;padding:0;margin-left:20px}
.s1 .the-parts .pd-slider > li:nth-child(2){float:none;width:100%}
.s2 .qa .alien-wrap{top:20px;left:0}
.s2 .qa .alien-01{top:0;left:100px}
.s2 .qa .qa-question-wrap{padding-top:0;padding-bottom:0;margin:40px 0 0}
.s2 .number-wrap{width:100%;position:relative;text-align:center;top:0;left:15px;background:#fff}
.s2 .number{font-size:2em;width:35px;height:35px;line-height:35px}
.s2 .number-box{position:absolute;background:rgba(226,0,26,1);width:35px;height:35px;text-align:center;transform:skewX(-20deg);top:0}
.s2 .qa-question-title{width:100%;text-align:center;padding:20px 0 10px}
.s2 .qa-skip .step-back{position:relative;top:0;left:0}
.s2 .step-back a.back-btn{font-size:1.2em}
.block-sub{width:95%;padding:0}
.s2 .qa-question-title p{font-size:1.25em;line-height:1.6;text-align:center}
.qa-sikp-btn > .gray-txt{font-size:1.2em;line-height:1.6;padding:0 15px;margin:15px 0 10px}
.qa-final .ans-txt-wrap{width:100%;top:7%;padding:0}
.qa-final .ans-txt{padding:0 15px}
.ans-imgbg{display:block;position:relative;top:50px;left:0;z-index:4}
.qa-final .ans-txt-number,.qa-final .ans-txt-title{font-size:2.6em}
.qa-final .ans-txt-sub{font-size:1.6em;line-height:1.6;padding:5px 0}
.qa-final .ans-txt-dec{font-size:1em;padding:0}
.open-link-wrap{padding:0 15px;top:-30px;position:relative;padding:0 15px}
.gray-txt{font-size:1em;line-height:2;margin:5px 0}
.open-link-wrap .open-link{width:80%;height:30px;margin:0}
.open-link-wrap .open-link .open-txt-link{font-size:1.2em;vertical-align:top}
.media{display:block;width:100%}
.media .media-icon{font-size:1em;width:30%}
.media .media-icon .share-link{margin-right:10px;line-height:20px;width:20px;height:20px}
.qa-final-btn{position:relative;right:0;bottom:77px;width:60%;padding:0 15px}
.qa-final-btn .table{display:table}
.qa-final .shape-wrap{padding-left:0;bottom:16%}
.open-link-wrap .open-link .arrow2{display:inline-block;width:60%}
.gray-txt{margin:0}
.s2 .qa-final > .contents-center{padding:33% 0}
.s2 .qa .alien-wrap{display:block}
.s2_1 .contents-center{width:100%;padding:14% 0}
.s2_1 .header-bg{width:100%;height:0;padding-bottom:56.25%;background-size:contain;background:url(https://asset.msi.com/event/mb/2017/pcBuild_landing/images/title_bg_2_xs.png) no-repeat 90% 40%;position:relative}
.s2_1 .txt2 .open-link{height:50px;margin:0}
.txt2 .sub-txt{font-size:1.6em;text-align:left}
.txt2 .h1{font-size:2em;line-height:1.2;text-align:left}
.s2_1 .txt2 .open-link .open-txt-link{width:100%;height:50px;font-size:1.2px}
.s2_1 .txt2 .open-link .arrow2{width:13%}
.txt2{padding:30px 0 0}
.s2_2 .contents-center{width:100%;padding:0}
.s2_2{width:90%;margin:0 auto;height:auto}
.s2_2 .body{width:100%;margin:20px auto}
.s2_2 .accordion > li > a{font-size:1em;line-height:1.6;vertical-align:middle;padding:5px;background:0 45%;text-indent:58px;padding:10px 10px 5px 15px}
.s2_2 .accordion > li.active > a{background:no-repeat 0 45%}
.s2_2 .case-body{margin:10px 0;padding:10px;height:260px;overflow:auto;margin:20px 0}
.s2_2 .case{margin-bottom:30px}
.s2_2 .case .title{font-size:1em}
.s2_2 .case .txt{font-size:1em}
.s2_2 .case img{width:70%;max-width:100%}
.s2_2 .alien-wrap{display:none}
.s3 .block-header .title{width:90%}
.s3 .content-1{width:90%;margin:0 auto;float:none}
.s3 .content-2{width:100%;float:none;position:relative;z-index:2}
.s3 .youtub-video-wrap{width:100%;padding:0}
.s3 .video-container{width:100%;position:relative}
.s3 .article-title{color:#e2001a;font-size:1.6em;line-height:1.4;margin:15px 0 5px}
.s3 .dec-body .txt{font-size:1em;line-height:1.6;margin:10px 0}
.s3 .dec-body .txt .list-txt li{padding:2px 0}
.s3 .block-header{background:url(../images/title_bg_3_xs.jpg) no-repeat center center}
.s3 .video-slider-bar{width:100%;margin:0 auto;left:0;margin:0 0}
.s3 .slider-body{width:60%;padding:0;margin:0 auto}
.s3 .content-1 .title{font-size:1.6em;line-height:1.6;padding:15px 0}
.s3 .slider-body li{height:10px;line-height:10px;text-align:center;padding:2px}
.s3 .slider-body .on-link{border:0;font-size:1em}
.s3 .slider-body li span:nth-child(1){display:none}
.s3 .slider-body li span:nth-child(2){display:inline-block;width:5px;height:5px;margin:5px;background:#D6D6D6;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:5px;border:0}
.s3 .dec-wrap{padding:10px 15px;height:auto;width:100%}
.s3 .dec-body{width:100%;padding:0}
.navbar-fix a{width:30px;height:30px;line-height:30px}
.nav-icon a{width:30px;height:30px;line-height:30px;width:30px;height:30px;line-height:30px}
.fa-icon{display:block;font-size:15px;color:#000;padding:0;margin:0}
.s4{width:90%;margin:0 auto}
.ebook { padding:30px 15px; }
.eb-title {font-size: 2.6em; }
.eb-txt {font-size: 1.2em; line-height: 1.4; } 
}
@media screen and (max-width: 320px) {
.qa-final .ans-txt-wrap{width:100%;top:5%;padding:0}
.qa-final-btn{position:relative;right:0;bottom:80px;width:60%;padding:0}
.open-link-wrap .open-link{width:100%;height:30px;margin:0}
.qa-final-btn .table{display:table}
.qa-final .shape-wrap{padding-left:0;bottom:16%}
.open-link-wrap .open-link .arrow2{display:inline-block;width:60%}
}