@charset "utf-8";

.only-desktop {display:block;}
.only-desktop-tablet {display:block;}
.only-tablet-mobile {display:none;}
.only-tablet {display:none;}
.only-mobile {display:none;}

/* Landscape tablet */
@media (max-width: 1280px) {
	body, input, textarea, select, button, table {font-size:16px;}

	h2.heading {font-size:36px;}

	.section-hero .hero .contain {height:640px;}
	.section-hero .hero .txt-wrap {top:125px;}
	.section-hero .hero .txt-wrap .txt1 img {max-width:330px;}
	.section-hero .hero .txt-wrap .txt2 {top:90px;}
	.section-hero .hero .txt-wrap .txt2 img {max-width:150px;}
	.section-hero .hero .img-wrap {max-width:680px;}

	.section-product {padding:85px 0;}
	.section-product .slider {max-width:700px}

	.section-plus .short {font-size:14px;}

	.section-hand .img {max-width:830px; margin-top:55px;}

	.section-playing {padding:100px 30px;}
	.section-playing h2.heading {font-size:30px;}
	.section-playing .row:first-child .txt {padding-left:0;}

	.section-detail {padding:80px 0;}
	.section-detail .slide-page {position:relative; margin-bottom:-20px;}

	.section-faq {padding:60px 0;}
	.faq {font-size:16px;}

	.section-note10 {padding:60px 0; font-size:1em;}
	.section-note10 .heading {font-size:30px;}
	.section-note10 .buffup {height:50px;}
	.section-note10 .glap {font-size:30px;}
} 

/* Landscape tablet */
@media (max-width: 1024px) {
	h2.heading {font-size:33px;}

	.section-hero .hero .contain {height:600px;}
	.section-hero .hero .txt-wrap {top:125px;}
	.section-hero .hero .txt-wrap .txt1 img {max-width:300px;}
	.section-hero .hero .txt-wrap .txt2 {top:80px;}
	.section-hero .hero .txt-wrap .txt2 img {max-width:120px;}
	.section-hero .hero .img-wrap {max-width:640px;}

	.section-hand .img {max-width:750px;}

	.section-playing .contain {padding-left:30px; padding-right:30px;}
	.section-playing h2.heading {font-size:28px;}
	.section-playing .row .txt {padding-top:2%;}
	.section-playing .swiper-pagination-bullet {width:45px;}

	.section-info ul li h2 {font-size:18px;}
	.section-info ul li p {font-size:14px;}
	.section-info ul li p br {display:none;}

	.section-detail {padding:80px 0;}
	.section-detail h2.heading {font-size:31px;}
	.section-detail .slide-page {position:relative; margin-bottom:-20px;}
} 

/* portrait tablet */
@media (max-width: 800px) {	
	.only-desktop {display:none;}
	.only-tablet {display:block;}
	.only-tablet-mobile {display:block;}

	.contain {padding-left:30px; padding-right:30px;}

	.sitelogo {left:30px;}
	.gnb {right:30px;}

	h2.heading {font-size:30px;}

	.section-hero .hero {margin-bottom:30px;}
	.section-hero .hero .contain {height:500px;}
	.section-hero .hero .txt-wrap {top:108px;}
	.section-hero .hero .txt-wrap .txt1 img {max-width:270px;}
	.section-hero .hero .txt-wrap .txt2 {top:77px;}
	.section-hero .hero .txt-wrap .txt2 img {max-width:110px;}
	.section-hero .hero .img-wrap {max-width:520px; bottom:-45px;}
	.section-hero .hero .img-wrap .shadow img {max-width:130px;}

	.section-product .slider {padding:0 4%;}
	.section-product .slide-btn {display:none;}
	.section-product .slide-page {margin-top:20px; margin-bottom:-20px;}

	.section-plus {padding:70px 0;}
	.section-plus p br {display:none;}
	.section-plus .row .txt {display:block; width:100%; padding-right:0;}	
	.section-plus .row .img {display:block; width:100%;}
	.section-plus .row .img img {position:static; width:60%; margin-top:0; margin-right:0;}
	.section-plus .row2 .img {display:block; width:100%; padding-left:0; text-align:right;}
	.section-plus .row2 .img img {width:50%; margin-top:-30%; margin-right:5%;}
	.section-plus .row2 .txt {display:block; width:100%;}
	.section-plus .shadow {display:none;}

	.section-hand .img {width:100%; max-width:90%; margin-top:40px;}

	.section-playing {padding:60px 0;}
	.section-playing .row .txt {float:none; width:100%; text-align:center; padding:0 30px !important; margin-bottom:35px;}
	.section-playing .row .img {float:none; width:100%;}
	.section-playing .row2 {margin-top:60px;}
	.section-playing .slide-btn {display:block; margin-top:-20px; width:40px; height:40px; background-size:contain;}
	.section-playing .slide-prev {left:10px; background-image:url(../images/slide2_prev.png);}
	.section-playing .slide-next {right:10px; background-image:url(../images/slide2_next.png);}
	.section-playing .slide-page {position:static; line-height:0; text-align:center; margin-top:15px;}
	.section-playing .swiper-pagination-bullet {width:8px; height:8px; border-radius:100%;}
	.section-playing .swiper-pagination-bullet-active {background:#000;}

	.section-info {padding:40px 0;}
	.section-info ul {margin:0; width:100%; max-width:450px; margin:0 auto;}
	.section-info ul li {display:block; width:100%; padding:20px 0;}
	.section-info ul li h2 {margin:14px 0 10px;}
	.section-info ul li p br {display:none;}

	.section-detail {padding:60px 0;}
	.section-detail .slider {margin:0 -30px;}
	.section-detail .slide-page {margin-top:15px; line-height:0;}
	.section-detail .swiper-pagination-bullet {width:8px; height:8px;}

	.section-apps {padding:0 0 80px;}
	.section-apps .head {margin-bottom:30px;}
	.section-apps .head h2.heading {font-size:24px;}
	.section-apps .head p {font-size:14px;}
	.section-apps .cnt ul {margin:0 -15px;}
	.section-apps .cnt ul:after {content:""; display:block; clear:both;}
	.section-apps .cnt ul li {padding:0 10px; margin-bottom:25px; font-size:14px;}
	.section-apps .cnt ul li img {margin-bottom:8px;}
	.section-apps .ctr {margin-top:20px;}
	.section-apps .ctr .bt {margin:0 20px;}
	.section-apps .ctr .bt img {width:36px;}

	.section-global {padding:60px 0 100px;}
	.section-global h2.heading {font-size:24px; margin-bottom:40px;}
	.section-global .col {padding:0 30px;}
	.section-global .country img {height:100px;}
	.section-global .site img {height:50px;}
	.section-global .bt a {font-size:1.15em}
} 

/* Landscape phone */
@media (max-width: 640px) {
	body, input, textarea, select, button, table {font-size:15px; letter-spacing:-.05em;}

	.only-desktop-tablet {display:none;}
	.only-tablet {display:none;}
	.only-mobile {display:block;}

	.contain {padding-left:20px; padding-right:20px;}

	#header .contain {height:50px;}
	.sitelogo {top:12px; left:15px}
	.sitelogo a {width:90px; height:26px;}
	.gnb {top:13px; right:10px}
	.gnb ul li {margin-left:7px;}
	.gnb ul li a {font-size:12px; line-height:24px;}
	.gnb ul li a.link {margin-right:0;}
	.gnb ul li a.round {padding:0 9px; line-height:22px; font-size:12px;}
	.gnb ul li:last-child {margin-left:4px}
	.gnb ul.sns {position:absolute; top:48px; right:0;}
	.gnb ul.sns img {width:26px;}

	h2.heading {font-size:22px; letter-spacing:-.05em;}
	h2.heading br {display:none;}

	.txt-glap {height:15px;}
	.txt-glap-lg {height:22px;}

	.section-hero .hero {margin-bottom:0;}
	.section-hero .hero .contain {height:370px}
	.section-hero .hero .txt-wrap {top:100px;}
	.section-hero .hero .txt-wrap .txt1 img {max-width:240px;}
	.section-hero .hero .txt-wrap .txt2 {top:50px;}
	.section-hero .hero .txt-wrap .txt2 img {max-width:90px;}
	.section-hero .hero .img-wrap {width:90%; max-width:340px; bottom:-25px;}
	.section-hero .hero .img-wrap .img span {transform:rotate(10deg)}
	.section-hero .hero .img-wrap .shadow {left:63%; bottom:-40px;}
	.section-hero .hero .img-wrap .shadow img {max-width:90px;}
	.section-hero .content {padding:80px 0 40px;}
	.section-hero .content p br {display:none;}

	.section-product {padding:30px 0; margin-bottom:40px; position:relative;}
	.section-product .contain {padding:0;}
	.section-product .slider {padding:0;}
	.section-product .swiper-slide {padding:0 20px;}
	.section-product .slide-page {position:absolute; margin-top:0; margin-bottom:0; bottom:-30px; left:0; width:100%; line-height:0;}
	.section-product .swiper-pagination-bullet {width:12px; height:12px; margin:0 5px;}
	.section-product .swiper-pagination-bullet-active:after {top:-3px; right:-3px; bottom:-3px; left:-3px;}

	.section-plus {padding:50px 0;}
	.section-plus h2.heading {margin-bottom:.4em;}
	.section-plus .row .txt {padding:0; margin-bottom:20px;}
	.section-plus .row .img img {width:65%;}
	.section-plus .row2 .img img {width:55%; margin-right:0; margin-top:-38%;}
	.section-plus .row2 .txt {padding:0;}
	.section-plus .short {font-size:12px; line-height:18px; padding-left:.7em; text-indent:-.7em;}
	.section-plus .bnr span {margin-right:2px;}
	.section-plus .bnr img {height:38px;}

	.section-hand {padding-top:50px;}
	.section-hand p br {display:none;}
	.section-hand .img {max-width:100%; margin-top:25px;}

	.section-playing {padding:50px 0;}
	.section-playing h2.heading {font-size:20px;}
	.section-playing .row .txt {padding:0 !important; margin-bottom:20px;}
	.section-playing .row .txt p br {display:none;}
	.section-playing .contain {padding-left:20px; padding-right:20px;}
	.section-playing .slide-btn {margin-top:-17px; width:34px; height:34px;}
	.section-playing .slide-next {right:0;}
	.section-playing .slide-prev {left:0;}

	.section-info {padding:30px 0;}
	.section-info ul li {padding:20px 10px;}
	.section-info ul li img {height:38px;}
	.section-info ul li h2 {font-size:17px;}
	.section-info ul li p {font-size:13px;}
	.section-info ul li:nth-child(3) h2 br,
	.section-info ul li:nth-child(4) h2 br {display:none;}

	.section-detail {padding:50px 0;}
	.section-detail h2.heading {font-size:22px}
	.section-detail p {font-size:14px;}
	.section-detail p br {display:none;}
	.section-detail .marks {margin:25px -5px 30px;}
	.section-detail .marks img {width:30%; max-width:110px; margin:0 1px;}
	.section-detail .slider {margin:0 -20px;}
	.section-detail .slide-btn {margin-top:-17px; width:34px; height:34px;}
	.section-detail .slide-next {right:0;}
	.section-detail .slide-prev {left:0;}

	.section-apps {padding:20px 0 60px;}
	.section-apps .head {margin-bottom:20px;}
	.section-apps .head h2.heading {font-size:19px;}
	.section-apps .head p {font-size:12px; margin-top:5px;}
	.section-apps .cnt ul {margin:0 -15px;}
	.section-apps .cnt ul:after {content:""; display:block; clear:both;}
	.section-apps .cnt ul li {width:33.33333333%; padding:0 10px; margin-bottom:25px; font-size:13px;}
	.section-apps .cnt ul li:nth-child(6n+1) {clear:none;}
	.section-apps .cnt ul li:nth-child(3n+1) {clear:left;}
	.section-apps .cnt ul li img {margin-bottom:8px;}
	.section-apps .ctr {margin-top:10px;}
	.section-apps .ctr .bt {margin:0 15px;}
	.section-apps .ctr .bt img {width:28px;}

	.section-global {padding:40px 0 60px;}
	.section-global h2.heading {font-size:19px; margin-bottom:20px;}
	.section-global .cnt {margin:0 -10px;}
	.section-global .col {padding:0 10px;}
	.section-global .country {padding:15px 0; font-size:1.2em}
	.section-global .country img {height:70px; margin-right:4px;}
	.section-global .site {padding:15px 0 35px;}
	.section-global .site img {height:35px;}
	.section-global .bt a {font-size:1.05em; padding:5px 20px; border-radius:8px;}

	.section-contact {padding:40px 0;}
	.section-contact .head h2.heading {font-size:20px;}
	.section-contact .head .bt {top:-2px;}
	.section-contact .head .bt img {height:34px;}
	.section-contact .head .txt {margin-top:12px; padding:15px 0;}

	.form-wrap {margin-top:10px;}
	.form-table .row {margin:0;}
	.form-table .col {float:none; width:100%; padding:7px 0;}
	.form-table label {font-size:14px; line-height:1.4em;}
	.form-table .input {height:34px; padding:6px 10px; line-height:22px; font-size:14px;}
	.form-table textarea.input {height:120px;}
	.form-table .line {margin:15px 0;}
	.form-agree {margin-top:15px; margin-bottom:25px;}
	.form-agree dt {font-size:14px;}
	.form-agree dd {font-size:13px; padding-top:5px; line-height:1.3em;}
	.form-agree .scroll-box {height:70px; font-size:12px; line-height:16px; padding:5px; color:#888; font-weight:300;}
	.form-submit {height:45px;}

	.section-faq {padding:40px 0;}
	.section-faq .contain {padding:0;}
	.faq {font-size:15px; word-break:break-all;}
	.faq .q,
	.faq .a {top:9px; width:28px; height:28px; line-height:22px; font-size:15px;}
	.faq .tit a {padding:12px 15px 12px 60px;}
	.faq .tit .icon {display:none;}
	.faq .cnt {padding:14px 15px 14px 60px; border-top:1px solid #000;}

	.section-note10 {padding:40px 0; line-height:1.6em;}
	.section-note10 .heading {font-size:22px; margin-bottom:1em;}
	.section-note10 .t1 {font-size:1.1em;}
	.section-note10 .t2.mg {margin-top:2em;}
	.section-note10 .note {font-size:1.07em}
	.section-note10 p br {display:none;}
	.section-note10 .buffup {height:35px; margin-left:0;}
	.section-note10 .glap {display:block; font-size:27px; margin-top:12px;}

} 

/* Landscape phones and down */
@media (max-width: 320px) {

}