.tit{font-size: 42px;color: #fff;line-height: 1.3em;font-weight: bold;}
.subtit{font-size: 22px; font-weight: 400; line-height: 1.2em;color: #fff;}

.btn{display: inline-block;border-radius: 8px;margin-top: 20px;}
.btn-white{width:150px; background-color: #fff; padding:20px 0px;transition: all 0.2s}
.btn-white span{color:#f4869d;font-size: 18px;font-weight: bold;transition: all 0.2s}
.btn-white:hover{width:160px; border: 1px solid #fff;background: none; padding: 25px 0px;}
.btn-white:hover span{color: #fff;}

.btn-solid{padding:10px 45px;border: 1px solid #fff;transition: all 0.2s}
.btn-solid span{color:#fff;font-size: 18px;font-weight: bold;}
.btn-solid:hover{background-color: #fff;transition: all 0.2s;}
.btn-solid:hover span{color: #f4869d;transition: all 0.2s}


.kpop-section{display: grid; grid-template-columns: 50% 50%;}

.txt-contents-wrap{padding: 5% 2%;position: relative; /*top: 50%;*/ transform: translateY(-50%);}
.txt-contents-wrap dt{margin-bottom: 20px;}
.txt-contents-wrap dt span{display: block; font-size: 12px;line-height: 1rem;margin-bottom: 10px;}
.txt-contents-wrap dd{font-size: 18px; color: #fff;margin-bottom: 10px;line-height: 1.65em;}
.txt-contents-wrap dd:last-child{margin: 0;}
.img-contents{background-color: #fff;}
.img-wrap{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}




.kpop-main-1{background-image: url(/resources/images/kpop/bg-3.png); background-attachment: fixed;position: relative;background-position: center center; background-size: cover; background-repeat: no-repeat; }
.kpop-main-1 .kpop-wrap{padding: 5% 0%;box-sizing: border-box;max-width: 1120px; margin: 0 auto;display: grid;}
.kpop-main-1 .kpop-wrap .kpop-top{display: grid; grid-template-columns: 50% 50%;}
.kpop-main-1 .kpop-wrap .kpop-top .left{width: 100%;text-align: left;}
.kpop-main-1 .kpop-wrap .kpop-top .left h1 {margin: 25px 0 25px 0;text-align: left;font-size: 2.0rem;margin-bottom: 25px;}
/*.kpop-main-1 .kpop-wrap .kpop-top .left a{margin-top: 25px;}*/
.kpop-main-1 .kpop-wrap .kpop-top .btn {width: 46%;    padding: 12px 18px;margin: 4px 4px;}
.kpop-main-1 .kpop-wrap .kpop-top .right{width: 100%;}
.kpop-main-1 .kpop-wrap .kpop-top .right a{display: inline-block; background-image: url(/resources/images/kpop/main-obj-0.png);background-size: cover; padding-bottom: 56.25%;width: 100%;}

.kpop-main-1 .kpop-wrap .kpop-bottom{padding: 2% 0%;}
.kpop-main-1 .kpop-wrap .kpop-bottom .title { padding:30px 0; position:relative; }
.kpop-main-1 .kpop-wrap .kpop-bottom .title h3 { font-size:38px; color:#fff; font-weight:bold; display:inline-block; }
.kpop-main-1 .kpop-wrap .kpop-bottom .title a { font-size:26px; color:#fff; font-weight:bold; position:absolute; right:0; bottom:0; padding:30px 0; }
.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap{display:grid; grid-template-columns:repeat(4, 1fr); background-color:rgba(255,255,255,0.3); padding:20px; grid-gap:15px; }
.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap .blog-wrap-content{position: relative;background-color: #fff;}
/*.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap .blog-wrap-content .img{position: relative;}*/
.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap .blog-wrap-content .image { width:100%; height:200px; vertical-align:middle; display:block; text-align:center; position:relative; }
.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap .blog-wrap-content .txt-wrap{box-sizing:border-box; padding:15px; height:150px; position:relative; }
.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap .blog-wrap-content .txt-wrap p{font-size: 18px; color: #222; font-weight: bold;line-height: 1.5rem;}
.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap .blog-wrap-content .txt-wrap a{position: absolute;bottom: 20px;display: block;left: 0;width: 100%;padding-left: 10%;box-sizing: border-box;color: #A383FD; font-size: 14px; font-weight: 600;}

.kpop-main-2 .txt-contents{background-image: url(/resources/images/kpop/bg-2.png);background-repeat: no-repeat;background-size: cover;background-position: left center;position: relative;}
.kpop-main-2 .txt-contents .txt-contents-wrap{padding: 20% 20%;position: relative; /*top: 50%;*/ transform: translateY(0);}
.kpop-main-2 .img-contents{position: relative;}

.kpop-main-3 .txt-contents{background-image: url(/resources/images/kpop/bg-2.png);background-repeat: no-repeat;background-size: cover;background-position: right center;position: relative;}
.kpop-main-3 .txt-contents .txt-contents-wrap{padding: 15% 20%;position: relative; /*top: 50%;*/ transform: translateY(0);}
.kpop-main-3 .img-contents{position: relative;}

.kpop-main-4 .txt-contents{background-color: #F4879E;position: relative;}
.kpop-main-4 .txt-contents .txt-contents-wrap{padding:0% 20%;position: relative;top: 0 !important;transform: translateY(0);}
.kpop-main-4 .txt-contents .txt-contents-wrap:nth-child(1){padding-top: 10%;padding-bottom: 5%;}
/*
.kpop-main-4 .txt-contents .txt-contents-wrap:nth-child(1) dd{padding-left: 30px;position:relative}
.kpop-main-4 .txt-contents .txt-contents-wrap:nth-child(1) dd:nth-child(2)::before{content: ''; width: 20px;height: 20px; display: inline-block;background-image: url(/resources/images/kpop/icon-building.svg);position: absolute; left: 0; top: 50%; transform: translateY(-50%);background-size: cover; background-repeat: no-repeat;}
.kpop-main-4 .txt-contents .txt-contents-wrap:nth-child(1) dd:nth-child(3)::before{content: ''; width: 20px;height: 20px; display: inline-block;background-image: url(/resources/images/kpop/icon-skype.svg);position: absolute; left: 0; top: 50%; transform: translateY(-50%);background-size: cover; background-repeat: no-repeat;}
.kpop-main-4 .txt-contents .txt-contents-wrap:nth-child(1) dd:nth-child(4)::before{content: ''; width: 20px;height: 20px; display: inline-block;background-image: url(/resources/images/kpop/icon-mail.svg);position: absolute; left: 0; top: 50%; transform: translateY(-50%);background-size: cover; background-repeat: no-repeat;}
.kpop-main-4 .txt-contents .txt-contents-wrap:nth-child(1) dd:nth-child(4) a{color:#fff;}
*/

.kpop-main-4 .txt-contents .txt-contents-wrap:nth-child(2){padding-bottom: 10%;}
.kpop-main-4 .img-contents{position: relative;}

/* benefit */

.kpop-benefit .txt-contents .txt-contents-wrap{padding:10% 20%;position: relative;top: 0 !important;transform: translateY(0);}

.kpop-benefit .txt-contents{background-color: #F4879E;position: relative;}
.kpop-benefit .txt-contents .txt-contents-wrap{padding: 20% 10%;position: relative;}
.kpop-benefit .img-contents{position: relative;background-color: #fff;}

/* mail */
.mail-section{background-color: #A27BF8;}
.mail-section .mail-section-wrap{max-width: 1120px; margin: 0 auto;padding: 4% 2%;width: 100%;box-sizing: border-box;}
.mail-section .mail-section-wrap h3{text-align: center; color: #fff;font-size: 26px;font-weight: bold;margin-bottom: 2%;}
.mail-section .mail-section-wrap input.form{border: none;;border: 1px solid #fff;background: none;border-radius: 10px;width: 100%;padding-left: 5%;height: 50px;box-sizing: border-box;}
.mail-section .mail-section-wrap input::placeholder{color: #fff;}
.mail-section .mail-section-wrap label{display: none;}
.mail-section .mail-section-wrap .mc-field-group{display: inline-block;width: 32%;}
.mail-section .mail-section-wrap .mc-field-group:nth-child(3){margin: 0 2%;}
.mail-section .mail-section-wrap .button-wrap{width: 30%; background: none; display: inline-block;}
.mail-section .mail-section-wrap .button{border: 1px solid #fff; background: none; border-radius: 10px; width: 100%; padding: 1% 0; padding-left: 1%;height: 50px;color: #fff;font-weight: bold;}
.indicates-required{color: #fff;margin-bottom: 1%;}

/* sns */

.sns-section{background-color: #A27BF8}
.sns-section .sns-section-wrap{max-width: 800px; margin: 0 auto;padding:2%;width: 100%;box-sizing: border-box;text-align: center;display: table}
.sns-section .sns-section-wrap h3{font-size: 26px;color: #fff;display: table-cell;vertical-align: middle;font-weight: bold;}
.sns-section .sns-section-wrap .sns-icon-wrap{display: table-cell; vertical-align: middle;}
.sns-section .sns-section-wrap .sns-icon-wrap a{display: inline-block;}
.sns-section .sns-section-wrap .sns-icon-wrap a:nth-child(2){margin:0 20px}
.sns-section .sns-section-wrap .sns-icon-wrap a img{width: 50px;}

@media screen and (max-width: 1024px) { 

    .tit{font-size: 28px;color: #fff;line-height: 1.3em;font-weight: bold;}
    /*.subtit{font-size: 20px !important; font-weight: 400; line-height: 1.2em;color: #fff;}*/
    .txt-contents-wrap dd{font-size: 16px;}

    .kpop-main-1 .kpop-wrap{padding: 5%; padding-top:140px;}
    .kpop-main-1 .kpop-wrap .kpop-top{grid-template-columns:none}
    .kpop-main-1 .kpop-wrap .kpop-top .left{margin-bottom: 20px;}
    .kpop-main-1 .kpop-wrap .kpop-top .right {max-width: 500px; width: 100%; margin: 0 auto;}
    .kpop-main-1 .kpop-wrap .kpop-bottom{padding: 0;}
    .kpop-main-1 .kpop-wrap .kpop-bottom .title { padding:20px 0; }
	.kpop-main-1 .kpop-wrap .kpop-bottom .title h3 { font-size:24px; }
	.kpop-main-1 .kpop-wrap .kpop-bottom .title a { font-size:20px; padding:20px 0; }
	/*.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap { grid-template-columns:1fr; }*/
	.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap{ 
		grid-template-columns: repeat(4, minmax(40%, auto)); overflow: scroll; 
		width: 100%; max-width:990px; margin: 0 auto; padding:20px 0 !important;
 	}
    .kpop-section {grid-template-columns:none; /*margin-top:110px;*/}
    .kpop-main-2 { margin-top:110px; }
    .kpop-main-3 { margin-top:110px; }
    
    .img-wrap{position: relative; text-align: center; padding: 10%; top:0; left:0; transform:none; }

    .kpop-main-2 .txt-contents .txt-contents-wrap{padding: 10%;}
    .kpop-main-3 .txt-contents .txt-contents-wrap{padding:10%}
    .kpop-main-4 .txt-contents .txt-contents-wrap{padding: 8% !important;}
    .img-contents iframe{width: 100%; height: 500px !important;}
    .kpop-benefit .txt-contents .txt-contents-wrap{padding: 10%;}
    .indicates-required{display: none;}
 }
 @media screen and (max-width: 768px){
    .kpop-main-1 .kpop-wrap{padding: 20% 5%; padding-top:140px;}
    /*
    .kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap{ display: block; }
    .kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap .blog-wrap-content{margin-bottom: 10px;}
    .kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap .blog-wrap-content:last-child{margin-bottom: 0;}
    */
    .kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap{ 
		grid-template-columns: repeat(4, minmax(60%, auto)); overflow: scroll; 
		width: 100%; max-width:660px; margin: 0 auto; padding:20px 0 !important;
 	}
    .kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap .blog-wrap-content .txt-wrap {min-height: 150px;}
    .sns-section .sns-section-wrap{padding: 5%;}
    .sns-section .sns-section-wrap h3{display: block;margin-bottom: 15px;font-size: 18px;}
    .sns-section .sns-section-wrap .sns-icon-wrap a img{width: 30px;}
    .sns-section .sns-section-wrap .sns-icon-wrap{display: block;}
    .mail-section .mail-section-wrap{padding: 5% 2%;}
    .mail-section .mail-section-wrap h3{font-size: 18px;margin-bottom: 15px;}
    .mail-section .mail-section-wrap .mc-field-group{width: 100%;}
    .mail-section .mail-section-wrap input.form{height: 40px;}
    .mail-section .mail-section-wrap .mc-field-group:nth-child(3){margin: 3% 0;}
    .mail-section .mail-section-wrap .button-wrap{width: 100%;}
    .mail-section .mail-section-wrap .button{height: 40px;}
 }

 @media screen and (max-width:414px){
 	.kpop-main-1 .kpop-wrap .kpop-top .left h1 {margin: 25px 0 25px 0;text-align: left;font-size: 1.4rem;margin-bottom: 25px;}
	.kpop-main-1 .kpop-wrap .kpop-top .btn {width: 100%; display:block;    padding: 12px 18px;margin: 4px 4px;}
	.kpop-main-1 .kpop-wrap .kpop-bottom .kpop-blog-wrap{ 
		grid-template-columns: repeat(4, minmax(90%, auto)); overflow: scroll; 
		width: 100%; max-width:330px; margin: 0 auto; padding:20px 0 !important;
 	}
 }