body { min-height: 100vh; background-repeat: no-repeat; background-position: center 23.5%; background-size: contain; background-image: url(../img/bg-s.jpg);}
body a { text-decoration: none; outline-style: none;}
/*for_W640-*/
@media all and (min-width: 640px) {
body { background-position: center 24%;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
body { background-size: 140%; background-image: url(../img/bg.jpg); background-position: center 25%;}
}
/*for_W960-*/
@media all and (min-width: 960px) {
body { background-position: center 26%;}
}
/*for_W1280-*/
@media all and (min-width: 1280px) {
body { background-position: center 28%;}
}
/*for_W1400-*/
@media all and (min-width: 768px) {
body { background-size: 120%; background-image: url(../img/bg-l.jpg); background-position: center 28%;}
}

/*	header
============================== */
#header { box-sizing: border-box; width: 100%; margin: 0 auto; position: relative;}

/*_pageTitle*/
#pg_title { text-align: center; font-size: 200%;}

/*	business
============================== */
#pg_title { display: block; width: 44%; max-width: 380px; margin: .5em auto 0 auto; z-index: 1100;}
#pg_title .h2_txt { display: block; width: 100%; height: 0; padding-top: 17.551963048498845%; padding-top: -webkit-calc(152 / 866 * 100%); padding-top: calc(152 / 866 * 100%); background-repeat: no-repeat; background-size: contain;}
/*for_W640-*/
@media all and (min-width: 640px) {
#pg_title { margin: 1em auto 0 auto;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#pg_title { margin: 3em auto 0 auto;}
}
/*for_W960-*/
@media all and (min-width: 960px) {
#pg_title { margin: 5em auto 0 auto;}
}

/*	concept
============================== */
#concept { box-sizing: border-box; width: 100%; max-width: 1280px; margin: 0 auto; overflow-x: hidden; position: relative; z-index: 500;}
#concept #kirari1 { width: 30%; max-width: 300px; margin: 1em 0 0 1.5em; position: relative; z-index: 500;}
#concept #kirari_img1 { width: 100%; height: 0; padding-top: 137.042925278219396%; padding-top: -webkit-calc(862 / 629 * 100%); padding-top: calc(862 / 629 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/kirari1_1.png); position: relative; z-index: 1000; opacity: 0;}
#concept #kirari_img2 { width: 100%; height: 100%; background-repeat: no-repeat; background-size: contain; background-image: url(../img/kirari1_2.png); position: absolute; top: 0; left: 0; z-index: 1000; opacity: 0;}
#concept #kirari_img3 { width: 100%; height: 100%; background-repeat: no-repeat; background-size: contain; background-image: url(../img/kirari1_3.png); position: absolute; top: 0; left: 0; z-index: 1000; opacity: 0;}
#concept h2 { display: block; width: 30%; max-width: 240px; margin: -6.5em auto 0 auto; position: relative; z-index: 1500;}
#concept h2 .h2_txt { display: block; width: 100%; height: 0; padding-top: 15.822784810126582%; padding-top: -webkit-calc(100 / 632 * 100%); padding-top: calc(100 / 632 * 100%); background-repeat: no-repeat; background-size: contain;}
#concept .cont { width: 73%; text-align: left; line-height: 240%; letter-spacing: .2em; margin: 1em auto; font-size: 110%; font-weight: 600; padding-top: 1em; position: relative; z-index: 500;}
#concept .cont p { padding: .15em 0 1.5em 0;}
/*for_W410-*/
@media all and (min-width: 410px) {
#concept h2 { margin: -7.3em auto 0 auto;}
}
/*for_W480-*/
@media all and (min-width: 480px) {
#concept h2 { margin: -8.5em auto 0 auto;}
#concept .cont { width: 60%;}
}
/*for_W520-*/
@media all and (min-width: 520px) {
#concept h2 { margin: -9.5em auto 0 auto;}
}
/*for_W560-*/
@media all and (min-width: 560px) {
#concept h2 { margin: -10em auto 0 auto;}
}
/*for_W600-*/
@media all and (min-width: 600px) {
#concept h2 { margin: -10.5em auto 0 auto;}
}
/*for_W640-*/
@media all and (min-width: 640px) {
#concept { padding-bottom: 0;}
#concept h2 { margin: -15em auto 0 auto;}
#concept .cont { width: 50%; font-size: 120%; line-height: 220%; margin: 5em auto;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#concept { position: relative;}
#concept h2 { margin: 0; position: absolute; top: 8em; left: 30%;}
#concept .cont { width: 50%; font-size: 130%; margin: -9em 0 6em 30%; line-height: 240%;}
}
/*for_W960-*/
@media all and (min-width: 960px) {
#concept h2 { margin: 0; position: absolute; top: 9em; left: 30%;}
#concept .cont { width: 60%; font-size: 140%; line-height: 200%; margin: -10em 0 4em 33%;}
}
/*for_W1280-*/
@media all and (min-width: 1280px) {
#concept #kirari1 { margin: 2em 0 0 1.5em;}
#concept h2 { margin: 0; position: absolute; top: 10em; left: 21%;}
#concept .cont { width: 60%; font-size: 190%; line-height: 100%;}
#concept .cont .p_pdt { padding-top: 2em;}
}

/*	vision
============================== */
#vision { box-sizing: border-box; width: 100%; overflow-x: hidden; padding-top: 4em; position: relative; z-index: 100;}
#vision #kirari2 { width: 32%; max-width: 240px; position: absolute; top: 1em; right: -1em;}
#vision #kirari2_img1 { width: 100%; height: 0; padding-top: 137.042925278219396%; padding-top: -webkit-calc(716 / 476 * 100%); padding-top: calc(716 / 476 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/kirari2_1.png); opacity: 0;}
#vision #kirari2_img2 { width: 100%; height: 100%; background-repeat: no-repeat; background-size: contain; background-image: url(../img/kirari2_2.png); position: absolute; top: 0; left: 0; opacity: 0;}
#vision #kirari2_img3 { width: 100%; height: 100%; background-repeat: no-repeat; background-size: contain; background-image: url(../img/kirari2_3.png); position: absolute; top: 0; left: 0; opacity: 0;}
#vision h2 { display: block; width: 18%; max-width: 90px; padding-bottom: 1em; margin: 0 auto;}
#vision h2 .h2_txt { display: block; width: 100%; height: 0; padding-top: 20.858895705521472%; padding-top: -webkit-calc(34 / 163 * 100%); padding-top: calc(34 / 163 * 100%); background-repeat: no-repeat; background-size: contain;}
#vision h2 .v_line { display: block; width: 50px; height: 1px; background-color: rgba(255, 255, 255, .5); margin: 1em auto;}
#vision .title_j { width: 100%; text-align: center; font-size: 160%; letter-spacing: .1em; font-weight: 600; position: relative; z-index: 100;}
#vision .cont { width: 92%; max-width: 1280px; margin: 3em auto; text-align: left; line-height: 220%; letter-spacing: .05em; font-weight: 300; font-size: 105%;}
#vision .cont p { padding: 0 0 1em 0;}
/*for_W480-*/
@media all and (min-width: 480px) {
#vision .cont { width: 80%; line-height: 240%; font-size: 110%; left: 10%;}
}
/*for_W520-*/
@media all and (min-width: 520px) {
#vision .cont { font-size: 120%;}
}
/*for_W640-*/
@media all and (min-width: 640px) {
#vision { padding-top: 2em; margin-bottom: 8em;}
#vision h2 { display: block; width: 10%; padding: 5em 0 1em 0;}
#vision .title_j { font-size: 180%;}
#vision .cont { width: 70%; line-height: 250%; font-size: 130%;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#vision { padding-top: 5em; margin-top: -5em; margin-bottom: 0;}
#vision h2 { width: 8%;}
#vision .cont { width: 80%; line-height: 260%; font-size: 130%;}
#vision .cont p { padding: 0 0 1em 0;}
}
/*for_W960-*/
@media all and (min-width: 960px) {
#vision .title_j { font-size: 200%;}
#vision .cont { width: 80%; line-height: 200%; font-size: 130%;}
}
/*for_W1280-*/
@media all and (min-width: 1280px) {
#vision { padding-top: 0; margin-top: 0; margin-bottom: 0;}
#vision .title_j { font-size: 240%;}
#vision .cont { line-height: 190%; font-size: 180%; padding-top: 1em;}
}

/*	work
============================== */
#work { box-sizing: border-box; width: 100%; max-width: 1200px; margin: 0 auto; padding-top: 5em; overflow-x: hidden; position: relative; z-index: 100;}
#work #kirari3 { width: 44%; max-width: 300px; position: absolute; top: 0; left: -1em; z-index: 10;}
#work #kirari3_img3 { width: 100%; height: 0; padding-top: 110.211946050096339%; padding-top: -webkit-calc(572 / 519 * 100%); padding-top: calc(572 / 519 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/kirari3_3.png); opacity: 0;}
#work #kirari3_img2 { width: 100%; height: 100%; background-repeat: no-repeat; background-size: contain; background-image: url(../img/kirari3_2.png); position: absolute; top: 0; left: 0; opacity: 0;}
#work #kirari3_img1 { width: 100%; height: 100%; background-repeat: no-repeat; background-size: contain; background-image: url(../img/kirari3_1.png); position: absolute; top: 0; left: 0; opacity: 0;}

#work h2 { display: block; width: 18%; max-width: 90px; padding: 1em 0; margin: 0 auto; }
#work h2 .h2_txt { display: block; width: 100%; height: 0; padding-top: 20.858895705521472%; padding-top: -webkit-calc(34 / 163 * 100%); padding-top: calc(34 / 163 * 100%); background-repeat: no-repeat; background-size: contain;}
#work h2 .w_line { display: block; width: 50px; height: 1px; background-color: rgba(255, 255, 255, .5); margin: 1em auto;}
#work .title_j { text-align: center; font-size: 160%; font-weight: 600; letter-spacing: .1em; position: relative; z-index: 100;}
#work #work_list ul { width: 92%; margin: 4em auto 2.5em auto;}
#work #work_list li { width: 100%; height: 105px; border-radius: 500px; margin-top: 1em; position: relative;}
#work #work_list li::after { content: ''; width: 100%; height: 105px; border-radius: 500px; position: absolute; top: -0.3em; left: -0.3em; border: .5px solid rgba(255, 255, 255, .8);}
#work #work_list #li_drama { opacity: 1; margin-left: 0; background-color: rgba(96, 159, 255, .24);}
#work #work_list #li_variety { opacity: 1; margin-left: 0; background-color: rgba(255, 200, 92, .24);}
#work #work_list #li_newsinfo { opacity: 1; margin-left: 0; background-color: rgba(255, 140, 140, .24);}
#work #work_list #li_anime { opacity: 1; margin-left: 0; background-color: rgba(255, 171, 237, .24);}
#work #work_list #li_movie { opacity: 1; margin-left: 0; background-color: rgba(110, 234, 90, .24);}
#work #work_list li a { display: block; width: 100%; height: 100%; border-radius: 500px; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; z-index: 1000;}
#work #work_list li a:hover { background: rgba(0, 0, 0, .35);}
#work #work_list li a .li_text { display: block; flex-basis: 48%; text-align: center; font-size: 120%; font-weight: 600;}
#work #work_list li a .li_icon { display: block; flex-basis: 21%;}
#work #work_list li a .li_icon .img { display: block; width: 100%; height: 0; padding-top: 100%; background-repeat: no-repeat; background-size: contain;}
#work #work_list li a .li_ya { display: block; flex-basis: 7%; margin-left: 7%; margin-right: 6%;}
#work #work_list li a .li_ya .img { display: block; width: 100%; height: 0; padding-top: 100%; background-repeat: no-repeat; background-size: contain;}
/*for_W440-*/
@media all and (min-width: 440px) {
#work #work_list li, #work #work_list li::after { height: 110px;}
}
/*for_W640-*/
@media all and (min-width: 640px) {
#work #kirari3 { position: absolute; top: 40%; left: -2em;}
#work h2 { display: block; width: 10%; padding: 5em 0 1em 0;}
#work .title_j { font-size: 180%; font-weight: 600;}
#work #work_list { width: 92%; height: 0; padding-top: 56%; position: relative; margin: 4em 0 2em 6%;}
#work #work_list ul { width: 100%; margin: 0 auto; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; position: absolute; top: 0; left: 0;}
#work #work_list li { width: 28%; height: 0; padding-top: 28%; flex-basis: 28%; border-radius: 800px; margin: 0 5% 1em 0; position: relative;}
#work #work_list li::after { content: ''; width: 100%; height: 100%; border-radius: 800px; position: absolute; top: -0.5em; left: -0.5em; border: 1px solid rgba(255, 255, 255, .8);}
#work #work_list #li_drama, #work #work_list #li_variety, #work #work_list #li_newsinfo, #work #work_list #li_anime, #work #work_list #li_movie { margin-left: 0;}
#work #work_list li a { position: absolute; top: 0; left: 0;}
#work #work_list li a .li_text { width: 100%; flex-basis: 100%; font-size: 100%; position: absolute; top: 2em; left: -0.5em; text-align: center;}
#work #work_list li a .li_icon { width: 42%; flex-basis: 42%; position: absolute; top: 50%; left: 48%; transform: translate(-50%, -50%); -webkit- transform: translate(-50%, -50%);}
#work #work_list li a .li_ya { width: 10%; flex-basis: 10%; margin-left: 0; margin-right: 0; position: absolute; bottom: 2.4em; left: 43%;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#work { padding-top: 5em; margin-top: -2em;}
#work h2 { width: 8%;}
#work #work_list li a .li_text { font-size: 110%; top: 2.5em; left: 0;}
}
/*for_W960-*/
@media all and (min-width: 960px) {
#work .title_j { font-size: 200%;}
#work #work_list li a .li_text { font-size: 130%;}
#work #work_list li a .li_icon { width: 48%; flex-basis: 48%;}
}
/*for_W1280-*/
@media all and (min-width: 1280px) {
#work { background-position: top  42% left -5%; background-size: 20%;}
#work #kirari3 { left: 0;}
#work .title_j { font-size: 240%;}
#work #work_list li a .li_text { font-size: 180%;}
#work #work_list li a .li_ya { bottom: 3.5em;}
}

/*_collabo*/
#collabo_txt { width: 92%; margin: 0 auto; text-align: center; font-size: 150%; letter-spacing: .05em; line-height: 160%; font-weight: 600; padding: 2em 0 0 0;  position: relative; z-index: 100;}
#collabo_set { box-sizing: border-box; width: 92%; max-width: 1280px; margin: 2em auto 0 auto; background: rgba(255, 255, 255, 1); padding:  1.2em .5em 2em .5em; position: relative; z-index: 100;}
#collabo_set .c_title { font-size: 115%; text-align: center; font-weight: 600; padding: 1em 0; color: rgba(0, 0, 0, 1);}
#collabo_set .c_line { width: 60px; height: 1px; background-color: rgba(0, 0, 0, .8); margin: 0 auto 1em auto;}
#collabo_set ul { width: 66%; margin: 1em auto 0 auto; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center;}
#collabo_set li { flex-basis: 45%; text-align: center; margin: .5em 0;}
#collabo_set li .li_img { width: 100%; height: 0; padding-top: 66.079295154185022%; padding-top: -webkit-calc(300 / 454 * 100%); padding-top: calc(300 / 454 * 100%); background-repeat: no-repeat; background-size: contain;}
/*for_W640-*/
@media all and (min-width: 640px) {
#collabo_txt { letter-spacing: .15em; line-height: 160%; padding: .5em 0 1.5em 0;}
#collabo_set .c_title { font-size: 130%;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#collabo_txt { padding: 1em 0 2em 0;}
#collabo_set { padding: 1em .5em 2.5em .5em;}
#collabo_set .c_title { font-size: 140%;}
#collabo_set .c_line { width: 100px;}
#collabo_set ul { width: 80%; margin-top: 2em;}
#collabo_set li { flex-basis: 28%; margin-bottom: .5em; text-align: center;}
#collabo_set #item1 { order: 1;}
#collabo_set #item2 { order: 2;}
#collabo_set #item3 { order: 3;}
#collabo_set #item4 { order: 4;}
#collabo_set #item5 { order: 7;}
#collabo_set #item6 { order: 5;}
#collabo_set #item7 { order: 6;}
}
/*for_W960-*/
@media all and (min-width: 960px) {
#collabo_set .c_title { font-size: 150%;}
#collabo_set .c_line { width: 140px;}
}
/*for_W1280-*/
@media all and (min-width: 1280px) {
#collabo_txt { font-size: 200%; letter-spacing: .05em; line-height: 160%; padding: 1em 0 1em 0;}
#collabo_set { padding: 1em 3em 6em 3em;}
#collabo_set .c_title { font-size: 200%;}
#collabo_set .c_line { width: 180px;}
}
