body { min-height: 90vh;}
/*for_W1700-*/
@media all and (min-width: 1700px) {
body { background-repeat: no-repeat; background-size: 100%; background-position: top center; background-image: url(../img/main_bg.jpg?1);}
}
/*kirari1*/
#main_pcsp { display: none;}
#main_kirasp { display: block; width: 100%; height: 100%; max-height: 800px; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-position: top center; background-size: cover; background-image: url(../img/main_bg-s0.jpg?1); overflow: hidden; opacity: 0; -webkit-animation: main_kira 1000ms linear forwards; animation: main_kira 1000ms linear forwards; animation-delay: 100ms; z-index: 0;}
#main_kira1sp { width: 100%; position: absolute; top: 0; left: 0; z-index: 0;}
#main_kira1_1 { width: 100%; height: 0; padding-top: 87.150127226463104%; padding-top: -webkit-calc(685 / 786 * 100%); padding-top: calc(685 / 786 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari1_1s.png?0); position: absolute; top: 0; left: 0; opacity: 0; -webkit-animation: main_kira 500ms linear forwards; animation: main_kira 500ms linear forwards; animation-delay: 1000ms; z-index: 0;}
#main_kira1_2 { width: 100%; height: 0; padding-top: 87.150127226463104%; padding-top: -webkit-calc(685 / 786 * 100%); padding-top: calc(685 / 786 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari1_2s.png?1); position: absolute; top: 0; left: 0; opacity: 0; -webkit-animation: main_kira 500ms linear forwards; animation: main_kira 500ms linear forwards; animation-delay: 2000ms; z-index: 0;}
#main_kira2sp { width: 100%; position: absolute; bottom: 5em; right: 0; z-index: 0;}
#main_kira2_1 { width: 100%; height: 0; padding-top: 87.150127226463104%; padding-top: -webkit-calc(685 / 786 * 100%); padding-top: calc(685 / 786 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari2_1s.png); position: absolute; bottom: 0; right: 0; opacity: 0; -webkit-animation: main_kira 500ms linear forwards; animation: main_kira 500ms linear forwards; animation-delay: 500ms; z-index: 0;}
#main_kira2_2 { width: 100%; height: 0; padding-top: 87.150127226463104%; padding-top: -webkit-calc(685 / 786 * 100%); padding-top: calc(685 / 786 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari2_2s.png); position: absolute; bottom: 0; right: 0; opacity: 0; -webkit-animation: main_kira 500ms linear forwards; animation: main_kira 500ms linear forwards; animation-delay: 1500ms; z-index: 0;}
#main_kira2_3 { width: 100%; height: 0; padding-top: 87.150127226463104%; padding-top: -webkit-calc(685 / 786 * 100%); padding-top: calc(685 / 786 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari2_3s.png); position: absolute; bottom: 0; right: 0; opacity: 0; -webkit-animation: main_kira 500ms linear forwards; animation: main_kira 500ms linear forwards; animation-delay: 2500ms; z-index: 0;}
/*for_W480-*/
@media all and (min-width: 480px) {
#main_kirasp { max-height: 1000px;}
}
/*for_W520-*/
@media all and (min-width: 520px) {
#main_kirasp { max-height: 1200px;}
}
/*for_W600-*/
@media all and (min-width: 600px) {
#main_kirasp { max-height: 1300px;}
}
/*for_W640-*/
@media all and (min-width: 640px) {
#main_kirasp { max-height: 1400px;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#main_kirasp { display: none;}
#main_pcsp { display: block; width: 100%; height: 100%; max-height: 800px; position: absolute; top: 0; left: 0; background-image: url(../img/main_bg.jpg?1); background-position: bottom center; -webkit-animation: main_kira 1600ms linear forwards; animation: main_kira 1600ms linear forwards; animation-delay: 100ms;}
#main_pc-kira1sp { width: 50%; position: absolute; bottom: 0; left: 0; z-index: 1000;}
#main_pc-kira1_1 { width: 100%; height: 0; padding-top: 116.666666666666667%; padding-top: -webkit-calc(1400 / 1200 * 100%); padding-top: calc(1400 / 1200 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari1_1.png?0); position: absolute; bottom: 0; left: 0; opacity: 0; -webkit-animation: main_kira 500ms linear forwards; animation: main_kira 500ms linear forwards; animation-delay: 1500ms; z-index: 1000;}
#main_pc-kira1_2 { width: 100%; height: 0; padding-top: 116.666666666666667%; padding-top: -webkit-calc(1400 / 1200 * 100%); padding-top: calc(1400 / 1200 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari1_2.png); position: absolute; bottom: 0; left: 0; opacity: 0; -webkit-animation: main_kira 500ms linear forwards; animation: main_kira 500ms linear forwards; animation-delay: 2000ms; z-index: 1000;}
#main_pc-kira1_3 { width: 100%; height: 0; padding-top: 116.666666666666667%; padding-top: -webkit-calc(1400 / 1200 * 100%); padding-top: calc(1400 / 1200 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari1_3.png); position: absolute; bottom: 0; left: 0; opacity: 0; -webkit-animation: main_kira 800ms linear forwards; animation: main_kira 800ms linear forwards; animation-delay: 2500ms; z-index: 1000;}
#main_pc-kira2sp { width: 50%; position: absolute; top: 0; right: 0; z-index: 1000;}
#main_pc-kira2_1 { width: 100%; height: 0; padding-top: 116.666666666666667%; padding-top: -webkit-calc(1400 / 1200 * 100%); padding-top: calc(1400 / 1200 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari2_1.png); position: absolute; top: 0; right: 0; opacity: 0; -webkit-animation: main_kira 500ms linear forwards; animation: main_kira 500ms linear forwards; animation-delay: 1000ms; z-index: 1000;}
#main_pc-kira2_2 { width: 100%; height: 0; padding-top: 116.666666666666667%; padding-top: -webkit-calc(1400 / 1200 * 100%); padding-top: calc(1400 / 1200 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari2_2.png); position: absolute; top: 0; right: 0; opacity: 0; -webkit-animation: main_kira 500ms linear forwards; animation: main_kira 500ms linear forwards; animation-delay: 1500ms; z-index: 1000;}
#main_pc-kira2_3 { width: 100%; height: 0; padding-top: 116.666666666666667%; padding-top: -webkit-calc(1400 / 1200 * 100%); padding-top: calc(1400 / 1200 * 100%); background-repeat: no-repeat; background-size: contain; background-image: url(../img/main_kirari2_3.png); position: absolute; top: 0; right: 0; opacity: 0; -webkit-animation: main_kira 800ms linear forwards; animation: main_kira 800ms linear forwards; animation-delay: 3000ms; z-index: 1000;}
}
/*for_W960-*/
@media all and (min-width: 960px) {
#main_pcsp { max-height: 1000px; background-position: top center;}
}
/*for_W1700-*/
@media all and (min-width: 1700px) {
#main_pcsp { background-image: url(../img/cover.png); }
}

/*	news_pu
============================== */
#news_pu { box-sizing: border-box; width: 92%; max-width: 500px; background: rgba(255, 255, 255, .8); padding: .75em 3em .75em 2em; border-radius: 10px; z-index: 1500; font-size: 90%; line-height: 160%; letter-spacing: .03em; margin: 1em auto; position: relative; z-index: 1000;}
#news_pu a { color: rgba(0, 0, 0, 1);}
#news_pu a:hover { color: rgba(0, 0, 0, .75);}
#news_pu a::after { content: ''; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-image: url(../img/ya_white.png); position: absolute; right: 10px; top: 50%; margin-top: -10px; filter: brightness(10%);}
#news_pu.blank a::after { content: ''; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-image: url(../img/blank.png); position: absolute; right: 10px; top: 50%; margin-top: -10px; filter: brightness(10%);}
#news_pu #star { width: 36px; height: 36px; background-repeat: no-repeat; background-size: contain; background-image: url(../img/news_star.png); position: absolute; top: -12px; left: -12px;}
#news_pu #blk_txt { font-size: 85% !important; color: rgba(0, 0, 0, .4); white-space: nowrap;}
/*for_W480-*/
@media all and (min-width: 480px) {
#news_pu { font-size: 96%; letter-spacing: .05em;}
}
/*for_W640-*/
@media all and (min-width: 640px) {
#news_pu { font-size: 98%;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#news_pu { font-size: 110%; letter-spacing: .05em; margin-left: calc(96% - 500px); padding: 1em 3.2em 1em 2.5em;}
}

/*	news
============================== */
#news { box-sizing: border-box; width: 100%; max-width: 1280px; margin: 0 auto; padding: 3em 0 4em 0; position: relative; z-index: 1000;}
#news h2 { display: block; width: 38%; max-width: 220px; margin: 0 auto; z-index: 1100;}
#news 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;}
#news .cont { width: 92%; margin: 0 auto; padding: 2em 0;}
#news .cont ul { width: 100%;}
#news .cont li { width: 100%; border-bottom: .5px solid rgba(255, 255, 255, .75); position: relative;}
#news .cont li:first-child { border-top: .5px solid rgba(255, 255, 255, .75);}
#news .cont li a { width: 100%; height: 100%; display: block; position: relative; z-index: 1200;}
#news .cont li a::after { content: ''; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-image: url(../img/ya_white.png); position: absolute; right: 10px; top: 50%; margin-top: -10px;}
#news .cont li.blank a::after { content: ''; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-image: url(../img/blank.png); position: absolute; right: 10px; top: 50%; margin-top: -10px;}
#news .cont li a:hover::after, #news .cont li.blank a:hover::after { opacity: .8;}
#news .cont li a .li_cont { width: calc(100% - 40px); padding: 1.5em 0; line-height: 160%; letter-spacing: .05em;}
#news .cont li a .li_date { font-weight: 600; padding-bottom: .5em; font-size: 95%;}
#news .cont li a .blk_txt { padding: .5em 0 0 0; font-size: 90% !important; color: rgba(255, 255, 255, .3); white-space: nowrap;}

#news_lnk { width: 34%; max-width: 180px; height: 44px; border: 1px solid rgba(255, 255, 255, 1); border-radius: 50px; position: absolute; bottom: 0; right: 4%; z-index: 1000;}
#news_lnk .lnk_imgsp { display: block; width: 60%; max-width: 110px; position: absolute; top: 38%; left: 50%; transform: translate(-50%, -50%); -webkit- transform: translate(-50%, -50%);}
#news_lnk .lnk_img { display: block; width: 100%; height: 0; padding-top: 13.888888888888889%; padding-top: -webkit-calc(40 / 288 * 100%); padding-top: calc(40 / 288 * 100%); background-repeat: no-repeat; background-size: contain; position: absolute; top: 0; left: 0;}
#news_lnk a { width: 100%; height: 100%; display: block; border-radius: 50px; position: absolute; top: 0; left: 0;}
#news_lnk a:hover { background: rgba(255, 255, 255, .2);}
/*for_W640-*/
@media all and (min-width: 640px) {
#news_lnk .lnk_imgsp { position: absolute; top: 35%; left: 50%; transform: translate(-50%, -50%); -webkit- transform: translate(-50%, -50%);}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#news_lnk .lnk_imgsp { position: absolute; top: 35%; left: 50%; transform: translate(-50%, -50%); -webkit- transform: translate(-50%, -50%);}
#news .cont ul { margin-bottom: 2em;}
#news .cont li a .li_cont { display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center;}
#news .cont li a .li_date { box-sizing: border-box; flex-basis: 17%; padding: 0; padding-left: 2%; text-align: left;}
#news .cont li a .li_txt { box-sizing: border-box; flex-basis: 80%; padding: 0;}
#news .cont li.blank a .li_txt { flex-basis: 60%; padding-right: 4%;}
#news .cont li a .blk_txt { padding: 000; text-align: right;}
}
/*for_W830-*/
@media all and (min-width: 830px) {
#news .cont li.blank a .li_txt { flex-basis: 61%;}
}
/*for_W900-*/
@media all and (min-width: 900px) {
#news .cont li.blank a .li_txt { flex-basis: 62%;}
}
/*for_W960-*/
@media all and (min-width: 960px) {
#news h2 {  margin: 8em auto 0 auto;}
#news .cont li a .li_cont { font-size: 120%;}
#news_lnk { height: 50px;}
#news .cont li.blank a .li_txt { flex-basis: 63%;}
}
/*for_W1100-*/
@media all and (min-width: 1100px) {
#news { padding: 0 0 6em 0;}
#news .cont { padding: 3em 0;}
#news .cont li a .li_cont { font-size: 140%;}
#news .cont li.blank a .li_txt { flex-basis: 61%;}
}
/*for_W1200-*/
@media all and (min-width: 1200px) {
#news .cont li.blank a .li_txt { flex-basis: 62%;}
}
/*for_W1280-*/
@media all and (min-width: 1280px) {
#news .cont li a .li_cont { font-size: 160%;}
#news_lnk { height: 60px;}
#news_lnk .lnk_imgsp { width: 60%; max-width: 120px;}
#news .cont li a::after { right: 20px;}
#news .cont li.blank a::after { right: 20px;}
#news .cont li.blank a .li_txt { flex-basis: 63%;}
#news .cont li a .blk_txt { font-size: 80% !important;}
}

/*	products
============================== */
#products { box-sizing: border-box; width: 100%; max-width: 480px; margin: 0 auto; position: relative; z-index: 500; }
#products #kirari1 { display: none;}
#products #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;}
#products #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: 500; opacity: 0;}
#products #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: 500; opacity: 0;}
#products h2 { display: block; width: 38%; max-width: 240px; margin: 5em auto 0 auto; position: relative; z-index: 500;}
#products h2 .h2_txt { display: block; width: 100%; height: 0; padding-top: 17.405063291139241%; padding-top: -webkit-calc(110 / 632 * 100%); padding-top: calc(110 / 632 * 100%); background-repeat: no-repeat; background-size: contain;}
#products .cont { box-sizing: border-box; width: 90%; text-align: left; margin: 2em auto; font-size: 110%; font-weight: 600; padding-top: 1em; z-index: 500;}
#products .product_sp { width: 100%; margin: 0 0 3em 0; position: relative;}
#products .product_sp .img_sp, #products .product_sp .img_sp0 { width: 100%;}
#products .product_sp .img { width: 100%; height: 0; padding-top: 56.25%; background-repeat: no-repeat; background-size: contain;}
#products .product_sp .img_sp0 .img { width: 100%; height: 0; padding-top: 56.25%; background: linear-gradient(to bottom, rgba(80,80,80,1) 0%,rgba(80,80,80,1) 50%,rgba(80,80,80,0.1) 100%); position: relative; margin-bottom: 6em;}
#products .product_sp .img_sp0 .img .cms_txt-sp { width: 68%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit- transform: translate(-50%, -50%);}
#products .product_sp .img_sp0 .img .cms_txt { width: 100%; height: 0; padding-top: 11.802575107296137%; padding-top: -webkit-calc(110 / 932 * 100%); padding-top: calc(110 / 932 * 100%); background-repeat: no-repeat; background-size: contain;}
#products .product_sp .img_sp0 + .txt_sp { display: none;}
#products .product_sp .txt_sp { width: 100%; margin: 1.2em 0 0 0; line-height: 100%; position: relative;}
#products .product_sp .txt_sp .btn { width: 50px; height: 50px; border: 1px solid rgba(255, 255, 255, 1); border-radius: 100px; position: absolute; top: 0; right: 0;}
#products .product_sp .txt_sp .btn .ya { width: 16px; height: 16px; background-repeat: no-repeat; background-size: contain; background-image: url(../img/ya_white.png); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit- transform: translate(-50%, -50%);}
#products .product_sp .txt_sp .title_txt { width: calc(100% - 55px); tex-talign: left; line-height: 130%; letter-spacing: .05em; font-size: 106%;}
#products .product_sp .txt_sp .sale_txt { font-weight: lighter; font-size: 96%; letter-spacing: .05em; padding-top: .8em;}
#products .product_sp a { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0;}
#products .product_sp a:hover { background-color: rgba(0, 0, 0, .2);}

/*	business
============================== */
#business_btn_all { width: 90%; max-width: 1100px; margin: 2em auto 0 auto;}
#btn_business a { display: block; width: 100%; height: 120px; border: 1px solid rgba(255, 255, 255, 1); border-radius: 100px; background-repeat: no-repeat; background-size: cover; background-position: center center; background-image: url(../img/btn_bg.jpg); position: relative;}
#btn_business a:hover { opacity: .8;}
#btn_business_title-sp { display: block; width: 46%; max-width: 240px; position: absolute; top: 18%; left: 50%; transform: translateX(-50%); -webkit- transform: translateX(-50%);}
#btn_business_title { 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;}
#btn_business-txt { display: block; width: 60%; position: absolute; top: 50%; left: 50%; transform: translateX(-50%); -webkit- transform: translateX(-50%); text-align: center; font-size: 110%; line-height: 140%; letter-spacing: .05em;}
#btn_business .ya { display: block; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-image: url(../img/ya_white.png); position: absolute; top: 50%; left: 85%; transform: translateY(-50%); -webkit- transform: translateY(-50%);}
/*for_W640-*/
@media all and (min-width: 640px) {
#btn_business-txt { display: block; width: 100%; position: absolute; top: 55%; left: 50%; transform: translateX(-50%); -webkit- transform: translateX(-50%); text-align: center; font-size: 120%; line-height: 140%; letter-spacing: .05em;}
}
/*for_W768-*/
@media all and (min-width: 768px) {
#btn_business a { height: 160px;}
#btn_business_title-sp { top: 20%;}
#btn_business-txt { font-size: 140%;}
#btn_business .ya { width: 40px; height: 40px;}
}
/*for_W960-*/
@media all and (min-width: 960px) {
#btn_business-txt { font-size: 160%;}
}
/*for_W1100-*/
@media all and (min-width: 1100px) {
#btn_business-txt { font-size: 180%;}
}
/*for_W1200-*/
@media all and (min-width: 1200px) {
#btn_business a { height: 180px;}
#btn_business-txt { font-size: 200%;}
}