@charset "UTF-8";
/* ======================================
トップページ：HomeMainVisualHtmlArea
 → common/css/content.css
*** SP first *** 
update on 2025.12.25
====================================== */
#obg-main {background: #ffffff; overflow: hidden;}
#obg-main a:link, #obg-main a:visited {color: #333333; text-decoration: none; -webkit-transition: all 0.3s; transition: all 0.3s;}
#obg-main a:hover, #obg-main a:active {opacity: 0.75;}
/* letter spacing --------------------------------------- */
.ls-1 {letter-spacing: -1px;}
.ls-2 {letter-spacing: -2px;}
.ls-3 {letter-spacing: -3px;}
.ls-4 {letter-spacing: -4px;}
.ls-5 {letter-spacing: -5px;}
.ls-6 {letter-spacing: -6px;}
.ls-7 {letter-spacing: -7px;}
.ls-8 {letter-spacing: -8px;}
.ls-9 {letter-spacing: -9px;}
.ls-10 {letter-spacing: -10px;}
.ls-11 {letter-spacing: -11px;}
.ls-12 {letter-spacing: -12px;}
/* ---------- 緊急ニュースリンク ---------- */
.EMnews {text-align: center; padding: 20px 15px 10px;}
.EMnews_list {max-width: 800px; margin: 0 auto;}
.EMnews_list li {margin: 0 0 24px;}
.EMnews_list li a {display: block; border: 1px solid #e7e7e7; padding: 14px;}
.EMnews_list li a[target=_blank] .txt {background: url(../../common/images/ico_blank_01.png) right no-repeat; background-size: auto 70%; padding-right: 1.2em;}

/* ---------- 初回ポップアップ ----------
.topModal {display: none; height: 100vh; left: 0; position: fixed; top: 0; width: 100%; z-index: 100;}
.modal__overlay {background: rgba(0, 0, 0, 0.6); height: 100vh; position: absolute; width: 100%;}
.topModal .bnr_area {left: 50%;  position: absolute; text-align: center; top: 50%; transform: translate(-50%, -50%); width: min(78.66vw,295px);}
.topModal .bnr_area .bnr img {width: 100%; height: auto;}
.topModal .bnr_area .btn {position: absolute; top: min(-4.26vw,-16px); right: min(-4.26vw,-16px); background: transparent;}
.topModal .bnr_area .btn img {width: min(8.53vw,32px); height: auto; cursor: pointer;}
.fixed {height: 100%; position: fixed; width: 100%;}
 */

/* ---------- メインビジュアル ---------- */
#top-main-visual {margin: 0; padding: 0; width: 100% !important;} /* (add on 2025.05.30) */
.top-slider {padding: 0; opacity: 0; transition: opacity 0.3s linear; line-height: 0;}
.top-slider.slick-initialized{opacity: 1;}
.top-slider .slide-pc {display: none;}
.top-slider li img {width: 100%; height: auto;}
.top-slider .slick-dots {bottom: 30px; left: 10px; text-align: left; width: auto;}
.top-slider .slick-dots li.slick-active {border: 1px solid #dddddd;}
.top-slider .slick-dots:after {display: none;}
.top-slider li table {width: 100% !important;}/* (add on 2025.05.30) */
.top-slider li.slide_202512 .slide-sp {background: url(../images/kv/sp_5_award.jpg) center top no-repeat; background-size: 100% auto;}/* (add on 2025.05.30) */

/* ---------- PICKUPスライドショー (2023.06.20) ---------- */
.top-pickup {background: #f8f8f8;}
.top-pickup .inr {padding: 25px 0;}
.top-pickup .top-p-ttl {font-size: 1.6em; text-align: center; margin: 0;}
.top-pickup .top-p-list {opacity: 0; transition: opacity 0.3s linear; margin: 0; padding: 0; line-height: 0;}
.top-pickup .top-p-list.slick-initialized {opacity: 1;}
.top-pickup .top-p-list li {margin: 0;}
.top-pickup .top-p-list li .list_inr {display: block; padding: 0 8px;}
.top-pickup .top-p-list li img {width: 100%; height: auto; border-radius: 5px;}

#top-pickup01 .slick-arrow {cursor: pointer; position: absolute; top: 0; bottom: 0; margin: auto; width: min(1.666vw,20px);}
#top-pickup01 .prev-arrow {left: min(-1.666vw,-20px); z-index: 2;}
#top-pickup01 .next-arrow {right: min(-1.666vw,-20px);}
#top-pickup01 .slick-disabled {display: none !important;}
/* ---------- AI肌診断 (2025.12.25) 追加 ---------- */
#top_hada {text-align: center; padding: 40px 15px; background-color: #f8f8f8;}
#top_hada .bnr_hada_sp img {width: 100%; height: auto; border-radius: 5px;}
/* ---------- CONCEPT (2023.02.03) 追加 ---------- */
.top-concept {background: #ffffff url(../bg_top-concept.jpg) center top no-repeat; background-size: auto 100%;}
.top-concept .inr {padding: 45px 60px 60px; text-align: center;}
.top-concept .top-cpt-ttl {padding: 0; margin: 0 0 15px; font-size: 1.125em;}
.top-concept .top-cpt-copy {padding: 0; margin: 0 0 20px; font-size: 2em;}
.top-concept .top-cpt-body {padding: 0; margin: 0 0 20px; font-size: 0.9em; line-height: 1.7;}
.top-concept .top-cpt-btn {width: 100%; max-width: 255px; margin: 0 auto;}
.top-concept .top-cpt-btn a {display: block; background-color: #000000; color: #ffffff !important; letter-spacing: 0; border-radius: 5px; padding: 10px 0; font-size: 0.9em;}
/* ---------- PURPOSE (2023.01.25)追加 ---------- */
#top-purpose {padding: 40px 15px 0;}
#top-purpose .top-pp-ttl {font-size: 1.6em; text-align: center; margin: 0 0 10px; letter-spacing: 0;}
#top-purpose .top-pp-list li {padding: 0 0 10px;}
#top-purpose .top-pp-list li a {display:-webkit-box; display:-ms-flexbox; display: flex; -webkit-align-items: stretch; -ms-align-items: stretch; align-items: stretch; -ms-flex-wrap: nowrap; flex-wrap: flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; nowrap; border-radius: 5px; border: 1px solid #dddddd; padding: 12px 0 12px 34px;}
#top-purpose .top-pp-list li .icn {width: 34px; padding: 0 20px 0 0;}
#top-purpose .top-pp-list li .icn img {width: 100%; height: auto;}
#top-purpose .top-pp-list li .txt {width: calc(100% - 34px); font-size: 1em;}
/* ---------- PRODUCT ---------- */
.block-contents-3 {width: auto !important; margin: 0 !important; padding: 0 !important;}
.block-contents-3 h2 {display: none;}
.block-contents-3 .colum-wrp {display:-webkit-box; display:-ms-flexbox; display: flex; flex-wrap: wrap; margin: 0 10px;}
#top-product .top-p-hdr {padding: 40px 0;}
#top-product .top-p-hdr .top-pr-ttl {margin: 0; font-size: 1.6em; letter-spacing: 0; text-align: center;}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(1),
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(2) {width: 100%;}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(3),
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(4) {width: 50%;}
.block-contents-3 .colum-wrp .colum-wrp-inner .ttl-black {font-size: 1.3em; line-height: 1; margin: 0 0 15px 5px; padding: 0 0 0 1.2em; border: 0; background: url(../ico_product.png) left no-repeat; background-size: 18px auto;}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner {display:-webkit-box; display:-ms-flexbox; display: flex; -webkit-align-items: stretch; -ms-align-items: stretch; align-items: stretch; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0 5px 40px;}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts {width: calc(50% - 5px); margin: 0 0 22px;}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts:nth-of-type(2n+1) {margin-right: 10px;}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(3)  .block-series .series-inner a.block-cts,
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(4)  .block-series .series-inner a.block-cts {width: 100%;}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .block-inner {position: relative;}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .description {position: absolute; bottom: -15px; display: inline-block; font-size: 0.8em; line-height: 1; letter-spacing: -0.5px; color: #666666;}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts img {width: 100%; height: auto;}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .img-name-series {font-size: 0.9em; line-height: 1.125; letter-spacing: -1px; padding: 24px 0 0;}
.block-contents-3 + .block-contents-5 {margin: 0;}
#top-product-ant .inr {margin: 0 15px; font-size: 0.7em; color: #737373; padding: 0 0 30px;}
/* ---------- RANKING (2023.01.25横スクロールに変更) ---------- */
#top-ranking {padding: 40px 15px;}
#top-ranking .top-r-ttl {font-size: 1.6em; text-align: center; margin: 0 0 10px; letter-spacing: 0;}
#top-ranking_scr {padding: 0; overflow: auto;}
#top-ranking .top-r-list {display:-webkit-box; display:-ms-flexbox; display: flex; -webkit-align-items: stretch; -ms-align-items: stretch; align-items: stretch; -ms-flex-wrap: nowrap; flex-wrap: nowrap; margin: 0; padding: 20px 0;  white-space: nowrap; overflow-x: auto;}
#top-ranking .top-r-list li {padding: 0 10px 0 0; min-width: 130px;}
#top-ranking .top-r-list li .list_inr {display: block; padding: 0;}
#top-ranking .top-r-list li a {display: block; position: relative;}
#top-ranking .top-r-num {position: absolute; top: 0; left: 3px; background-color: #f2bb9a; width: 30px; height: 30px; border-radius: 15px; margin: 0; text-align: center;}
#top-ranking .top-r01 .top-r-num {background-color: #c49c11;}
#top-ranking .top-r02 .top-r-num {background-color: #adadad;}
#top-ranking .top-r-num .top-r-num-txt {display: inline-block; font-size: 1.2em; line-height: 1; color: #ffffff; padding: 6px 0 0;}
#top-ranking .top-r-image {margin: 0; padding: 0; text-align: center;}
#top-ranking .top-r-image img {width: 100%; height: auto;}
#top-ranking .top-r-bc {position: absolute; top: 16%; left: 0; width: 34px;}
#top-ranking .top-r-bc img {width: 100%; height: auto;}
#top-ranking .top-r-name {position: relative; border-top: 1px solid #000000; padding: 10px 0 0; font-size: 1em; line-height: 1.25; text-align: center; font-weight: normal; margin: 0; letter-spacing: -0.5px; background: none;}
#top-ranking h3 span {display: inline; border: 0; padding: 0;}
#top-ranking .top-r01 .top-r-name,#top-ranking .top-r02 .top-r-name {border-top: 1px solid #de474d;}
#top-ranking .top-r-new {position: absolute; top: 0; right: 6px; font-size: 1em; color: #de474d; font-weight: bold;}
#top-ranking .top-r-txt {padding: 8px; font-size: 0.8em; color: #555555; text-align: center;}
/* ---------- INFORMATION ---------- */
.block-contents-5 h2 {display: none;}
.block-contents-5 .block-colum-cts {margin: 0 15px;}
#top-info .top-i-hdr {padding: 40px 0 30px;}
#top-info .top-i-hdr .top-i-ttl {margin: 0; font-size: 1.6em; letter-spacing: 0; text-align: center;}
#top-info .top-i-hdr .top-i-lnk {font-size: 1.05em; text-align: center; margin: 0;}
#top-info .top-i-hdr .top-i-lnk a {padding: 2px 1.5em 2px 0; background: url(../ico_more.png) right 1px top 0 no-repeat; background-size: auto 1.2em;}
ul.block-news {margin: 0;}
ul.block-news li a {display:-webkit-box; display:-ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 0 10px;}
ul.block-news li a .day-icn {display:-webkit-box; display:-ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; padding: 0; width: 45%;}
ul.block-news li a div.day-icn p.icn {margin: 0; padding: 0;}
ul.block-news li a div.day-icn time  {margin: 0; padding: 0 0 0 5px; line-height: 2em; white-space: nowrap;}
ul.block-news li a p.icn span {border-radius: 5px;}
ul.block-news li a p.icn span.goods {background-color: #ffd3b7; color: #000000;}
ul.block-news li a p.icn span.info {background-color: #eaeaea; color: #000000;}
ul.block-news li a p.ttl {width: 55%; line-height: 1.5; white-space: normal;}
/* ---------- SNS updated on 2023.09.04 ---------- */
#top-sns {width: 100%; padding: 0 0 40px;}
#top-sns .top-s-ttl {font-size: 1.6em; padding: 0; margin: 0 0 15px;}
#top-sns ul.top-s-links {text-align: center; padding: 0 0 20px;}
#top-sns ul.top-s-links li {display: inline-block; margin: 0 8px;}
#top-sns ul.top-s-links li a {display: block; width: 40px; height: 40px;}
#top-sns ul.top-s-links li a .mark {display: block; padding: 24% 0 0;}
#top-sns ul.top-s-links li a img {display: block; width: 100%; height: auto; margin: 0 auto;}
#top-sns .top-s-pics {text-align: center;}
#top-sns .top-s-pics img {width: 100%; max-width: 1200px; height: auto;}
/* ---------- SERVIES ---------- */
#top-services_scr {padding: 0 15px 30px;}
#top-services ul li {width: 100%; padding: 0 0 10px;}
#top-services ul li a {position: relative; display: block;}
#top-services ul li a:after {position: absolute; bottom:0; right: 4px; display: block; content: url(../ico_window.png); -webkit-transform: scale(0.52); transform: scale(0.52);}
#top-services ul li img {width: 100%; max-width: 391px; height: auto; border: 1px solid #e7e9ed; border-radius: 5px;}

/* -----------------------------------------------------

 for iPhone5 size

----------------------------------------------------- */
		@media screen and (max-width:320px) {
#search_nayami a {font-size: 0.9em;}
.block-series a.block-cts p.description span {font-size: 0.65em;}
.block-pickup div.bnr-slide {margin: 0 10px; zoom: 1;}
.block-pickup div.bnr-slide div#bnr-area-wrapper {position: relative; width: 240px;}
.block-pickup div.bnr-slide div#bnr-area-wrapper ul#bnr-area li img {width: 240px;}
/* ---------- CONCEPT (2023.02.03)追加 ---------- */
.top-concept .top-cpt-ttl {font-size: 1.125em;}
.top-concept .top-cpt-copy {font-size: 1.6em;}
.top-concept .top-cpt-body {font-size: 0.8em;}
.top-concept .top-cpt-btn a {font-size: 0.8em;}
/* ---------- RANKING ---------- */
#top-ranking .top-r-list li a {width: 120px;}
/* ---------- INFORMATION ---------- */
ul.block-news li a {display: block;}
ul.block-news li a .day-icn {width: 100%; padding: 0 0 6px;}
ul.block-news li a p.ttl {width: 100%;}
		}

/* -----------------------------------------------------

 for PC,Tablet

----------------------------------------------------- */
		@media screen and (min-width: 641px) {
/* ---------- 初回ポップアップ ---------- */
.topModal .bnr_area {width: min(33.54vw,483px);}
.topModal .bnr_area .btn {top: min(-1.04vw,-15px); right: min(-1.04vw,-15px);}
.topModal .bnr_area .btn img {width: min(2.08vw,30px); height: auto;}

/* ---------- メインビジュアル ---------- */
#top-main-visual {padding: 0; margin: 0; 
width: 100%; animation-name: fadeInKV; animation-delay: 0.5s; animation-duration: 1s; animation-fill-mode: forwards; opacity: 0;} /* (add on 2025.05.30) */
.top-slider {padding: 0 0 5px;}
.top-slider .slide-pc {display: block;}
.top-slider .slide-sp {display: none;}
.slick-dots {position: relative; width: 99%; max-width: 1360px; margin: -35px auto 0;}
/* (add on 2024.12.02)
.top-slider table {border-collapse: collapse; border: 0;} */

/* (add on 2025.05.30) */
@keyframes fadeInKV {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
/* ---------- PICKUP ---------- */
.top-pickup .inr {width: 90%; max-width: 1200px; margin: 0 auto; padding: 60px 0;}
.top-pickup .top-p-ttl {font-size: 2.2em; margin: 0 0 20px;}
.top-pickup .top-p-list li {width: min(25vw,290px);}
#top-pickup01 .top-p-list {margin: 0 50px;} /* 上のリストだけなぜか横幅いっぱいになるので調整(2023.6.30) */
#top-pickup01 .slick-arrow {cursor: pointer; position: absolute; top: 0; bottom: 0; margin: auto; width: min(1.666vw,20px);}
#top-pickup01 .prev-arrow {left: min(-1.666vw,-20px); z-index: 2;}
#top-pickup01 .next-arrow {right: min(-1.666vw,-20px);}
#top-pickup01 .slick-disabled {display: none !important;}
/* ---------- AI肌診断 (2025.12.25) 追加 ---------- */
#top_hada {text-align: center; padding: 20px 15px 80px;}
#top_hada .bnr_hada_pc img {width: min(51.28vw,718px); height: auto; border-radius: 5px; border: 1px solid #ddd;}
/* ---------- PRODUCT ---------- */
#top-product .top-p-hdr {padding: 60px 0;}
#top-product .top-p-hdr .top-pr-ttl {font-size: 2.2em;}
.block-contents-3 .colum-wrp {position: relative; width: 90%; max-width: 1200px; margin: 0 auto; display:-webkit-box; display:-ms-flexbox; display: flex; flex-wrap: nowrap; -webkit-box-pack: center; justify-content: center;}
.block-contents-3 .colum-wrp .colum-wrp-inner .ttl-black {font-size: min(2.13vw,25.6px); letter-spacing: -2px; margin-bottom: 30px; padding: 0 0 0 1.4em; background-size: min(2.33vw,28px) auto;}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(2) .ttl-black {letter-spacing: 0px;}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .description {bottom: min(-1.25vw,-15px); font-size: min(1.06vw,12.8px);}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .img-name-series {font-size: min(1.66vw,20px);}

.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(1) {width: 45%; margin-right: min(3vw,40px);}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(2) {width: 45%; margin-left: min(3vw,40px);}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(3) {position: absolute; bottom: min(-2.9vw,-60px); left: 50%; width: calc(45%/2); margin-left: min(3vw,40px); margin-right: calc(45%/2);}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(4) {width: calc(45%/2); position: absolute; bottom: min(-2.9vw,-60px); right: 0;}

#top-product-ant {width: 90%; max-width: 1200px; margin: 0 auto;}
/* ---------- CONCEPT ---------- */
.top-concept .inr {padding: 50px 0 60px;}
.top-concept .top-cpt-ttl {margin: 0 0 20px; font-size: 2.2em;}
.top-concept .top-cpt-copy {margin: 0 0 20px; font-size: 3.8em;}
.top-concept .top-cpt-body {margin: 0 0 30px; font-size: 1.3em;}
.top-concept .top-cpt-btn {max-width: 355px;}
.top-concept .top-cpt-btn a {padding: 10px 0; font-size: 1em;}
/* ---------- PURPOSE ---------- */
#top-purpose {width: 90%; max-width: 1200px; margin: 0 auto;}
#top-purpose .top-p-hdr {padding: 60px 0;}
#top-purpose .top-pp-ttl {font-size: 2.2em; margin: 0 0 20px;}
#top-purpose .top-pp-list {display:-webkit-box; display:-ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align:center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;}
#top-purpose .top-pp-list li {width: 30%; padding: 0 0 10px 10px;}

#top-purpose .top-pp-list li a {-ms-flex-wrap: wrap; flex-wrap: wrap; padding: 20px 12px;}
#top-purpose .top-pp-list li .icn {display: block; width: 100%; padding: 0; margin: 0 auto; text-align: center;}
#top-purpose .top-pp-list li .icn img {width: auto; height: 34px;}
#top-purpose .top-pp-list li .txt {display: block; width: 100%; font-size: 1em; text-align: center; padding: 15px 0 0; white-space: nowrap;}
/* ---------- RANKING ---------- */
#top-ranking {width: 90%; max-width: 1200px; margin: 0 auto 90px; padding: 60px 0 0;}
#top-ranking .top-r-ttl {font-size: 2.2em; margin: 0;}
#top-ranking_scr {padding: 0;}
#top-ranking .top-r-list li {width: 20%; max-width: 224px; margin: 0 0 0 20px; padding: 20px 0 0;}
#top-ranking .top-r-list li:nth-of-type(1) {margin: 0;}
#top-ranking .top-r-list li a {width: 100%;}
#top-ranking .top-r-num {top: -13px; left: 0; width: 36px; height: 36px; border-radius: 18px;}
#top-ranking .top-r-num .top-r-num-txt {font-size: 1.25em; padding: 8px 0 0;}
#top-ranking .top-r-bc {top: 20%; left: -2px; width: 42px;}
#top-ranking .top-r-name {font-size: min(1.5vw,1em); padding: 14px 0 0;}
#top-ranking .top-r-new {top: -10px; right: 40px;}
#top-ranking .top-r-txt {font-size: 0.875em; padding: 15px 0 0;}
/* ---------- INFORMATION ---------- */
.block-contents-5 {margin: 0 !important;}
.block-contents-5 .block-colum-cts {width: 90%; max-width: 1200px; margin: 0 auto;}
#top-info .top-i-hdr {padding: 100px 0 55px;}
#top-info .top-i-hdr .top-i-ttl {margin: 0; font-size: 2.2em; letter-spacing: 1px; text-align: center;}
#top-info .top-i-hdr .top-i-lnk {font-size: 1.05em; text-align: center; margin: 0;}
#top-info .top-i-hdr .top-i-lnk a {padding: 2px 1.5em 2px 0; background: url(../ico_more.png) right 1px top 0 no-repeat; background-size: auto 1.2em;}
ul.block-news {margin: 0;}
ul.block-news li {padding: 0;}
ul.block-news li a {padding: 15px 0;}
ul.block-news li a .day-icn {padding: 0; width: 20% !important; text-align: left;}
ul.block-news li a div.day-icn p.icn span {padding: 5px 0; height: auto; font-size: 0.93em;}
ul.block-news li a div.day-icn time  {font-size: 0.95em; padding: 0 0 0 4px;}
ul.block-news li a p.ttl {font-size: 0.95em; width: 77%;}
/* ---------- SNS updated on 2023.09.04 ---------- */
#top-sns {width: 100%; padding: 100px 0 40px;}
#top-sns .top-s-ttl {font-size: 2.2em; margin: 0 0 30px;}
#top-sns ul.top-s-links {padding: 0 0 60px;}
#top-sns ul.top-s-links li {display: inline-block; margin: 0 3px;}
#top-sns ul.top-s-links li a {width: 55px; height: 55px;}
/* ---------- SERVIES ---------- */
#top-services {margin: 0 0 90px;}
#top-services_scr {padding: 0; overflow: hidden;}
#top-services ul {display:-webkit-box; display:-ms-flexbox; display: flex; -webkit-align-items: stretch; -ms-align-items: stretch; align-items: stretch; -ms-flex-wrap: nowrap; flex-wrap: nowrap; width: 90%; max-width: 1200px;  margin: 0 auto;}
#top-services ul li {width: 33.33%; max-width: 393px; padding: 0 6px 0 0;}
#top-services ul li:nth-last-of-type(1) {padding: 0;}
		}

/* -----------------------------------------------------
 for less than 1200px
 ----------------------------------------------------- */
		@media screen and (min-width: 641px)  and (max-width: 1201px) {
#obg-main {font-size: 0.95em;}
/* ---------- INFORMATION ---------- */
ul.block-news li a .day-icn {padding: 0; width: 31.5% !important;}
ul.block-news li a p.ttl {width: 64%; padding: 3px 0 0;}
		}

/* -----------------------------------------------------
 for Tablet only
 ----------------------------------------------------- */
		@media screen and (min-width: 641px)  and (max-width: 1024px) {
		/* ---------- 緊急ニュースリンク ---------- */
.EMnews_list {max-width: 90%;}
/* ---------- メインビジュアル ---------- */
#top-main-visual {padding: 0;}
/* ---------- PURPOSE ---------- */
#top-purpose .top-pp-list li a {padding: 31.5px 0;}
#top-purpose .top-pp-list li:nth-of-type(1) a {padding: 20px 0;}
/* ---------- PRODUCT
.block-contents-3 .colum-wrp .colum-wrp-inner {width: calc(50% - 20px);}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(1) {width: calc(50% - 40px); margin-right: 30px; padding-right: 0;}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(2),
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(3) {width: calc(50% - 40px); margin-left: 30px; padding-left: 0; top: 52%;}
.block-contents-3 .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .description {top: 100%;}
 ---------- */

/* ---------- RANKING ---------- */
#top-ranking .top-r-list li {width: 224px; margin: 0 0 0 20px; padding: 20px 0 0;}
#top-ranking .top-r-list li:nth-of-type(1) {margin: 0;}
#top-ranking .top-r-bc {top: 20%; left: -2px; width: 42px;}
#top-ranking .top-r-new {right: 20px; font-size: 1em;}
/* ---------- SERVIES ---------- */
#top-services {max-width: 90%;}
#top-services ul li {width: 32.2%;}
/* ---------- block-footer ---------- */
#block-footer .block-link .block-inner {width: 640px;}
		}


/* -----------------------------------------------------
 for PC only
 ----------------------------------------------------- */
		@media screen and (min-width: 1025px) {
/* ---------- PC：メニュー文字色＝白 ---------- */
#hdr-nav.is-white a {color: #fff;}
#js-main-visual-list.is-white {color: #fff;}
#hdr-nav.is-white + #hdr-btn {width: 36px; height: 26px; text-indent: -9999em; background: url(/-/media/obagi/common/images/header/ico_menu_wh.png) right top no-repeat; background-size: cover;}
/* ---------- PC：ハンバーガーのマーク＝黒 ---------- */
#hdr-nav.is-black + #hdr-btn {width: 36px; height: 26px; text-indent: 0; background: none;}
/* ---------- メインビジュアル ---------- */
.top-slider {padding: 0 0 3px;}
/* ---------- PURPOSE ---------- */
#top-purpose .top-pp-list {-ms-flex-wrap: nowrap; flex-wrap: nowrap;}
/* ---------- PRODUCT 
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(1) {width: calc(50% - 50px); margin-right: 40px;}
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(2),
.block-contents-3 .colum-wrp .colum-wrp-inner:nth-of-type(3) {width: calc(50% - 50px); margin-left: 40px;}
---------- */

		}