@charset "UTF-8";
/* CSS Document */


/*--------------------------------------------------------------------------
BASE(PC)
---------------------------------------------------------------------------*/
body {
	/*font: 13px/1.231 arial, helvetica, clean, sans-serif;*/ background-color: #fff;
	-webkit-print-color-adjust: exact;
}


.pc-mode-01 {
    display: block !important;
}
.pc-mode-02 {
    display: inline !important;
}
.pc-mode-03 {
    display: inline-block !important;
}
.pc-mode-05 {
    display: flex !important;
}
.sp-mode-01 {
    display: none !important;
}
.sp-mode-02 {
    display: none !important;
}
.sp-mode-03 {
    display: none !important;
}
.sp-mode-04 {
    display: none !important;
}
.sp-mode-05 {
    display: none !important;
}
/* フォーマット設定*/
.inner {
	max-width: 940px;
	margin: 0 auto;
}
.inner-01 {
	max-width: 1120px;
	margin: 0 auto;
}
.inner-02 {
}

.inner-03 {
	max-width: 1120px;
	margin: 0 auto;
}

.cont-center {
    text-align: center;
}
.cont-left {
	float:left;
}
.cont-right {
	float:right;
}
/* common
-----------------------------------------------------------------*/
.toolBox01 { background-color: #0090dd; }

.function01 {
    margin-top: 6px;
    padding-bottom: 6px;
}

.boxList01 {
    margin-top: 20px;
}
.hadalab_container img {
	display:inline;
}
.hadalab_container a:hover{
	text-decoration:none;
}
.hadalab_container a:hover img{
    opacity: 0.7;
}
sup {
    font-size: 0.6em;
    vertical-align: super;
}
.txt-inline-block{
	display: inline-block;
}
.txt-f01{
	font-family: "Hiragino Mincho ProN", "Sawarabi Mincho","ヒラギノ明朝 Pro","Hiragino Mincho Pro","HGS明朝E","ＭＳ Ｐ明朝",serif;
}
.txt-01{
    color: #333;
    font-size:  1.143em;
    line-height: 2em;
    letter-spacing: 0.075em;
}
.txt-wrap-01 p{
    margin-bottom: 30px;
}
.txt-wrap-02 p{
    margin-bottom: 33px;
}
.txt-wrap-03 p{}
.small {
	font-size: 0.647em;
}
.small2 {
	font-size: 0.5em;
}
.small3 {
	font-size: 0.8em;
}
.small4 {
	font-size: 0.52em;
}
.small5 {
	font-size: 0.461538em;
}
.note-01 {
    /* font-size: 12px; */
    font-size: 0.857em;
    color: #777;
}
.note-01 dt{
    float: left;
}
.note-01 dd{
    padding-left: 2.35em;
}

.bnr-sstnblty{
	background: url(/-/Media/com/hadalabo/top/210805/bg_bnr.png)no-repeat center ;
	text-align: center;
	padding:140px 0;
}
#hadalabContainer .sp-mode-02{
	display:none;
}
.bnr-sstnblty img{
	border-radius:5px;
	box-shadow: 2px 2px 5px #dcdcdc;
}
/* タイトル(PC) */
.ttl-01 {
    text-align: center;
    margin-bottom: 80px;
}
.ttl-01 .cnt-ttl-01 {}
.ttl-01 .cnt-ttl-02 {}
.ttl-02 {
    color: #0084c8;
    font-size:  1.571em;
    font-weight: bold;
    letter-spacing: 0.075em;
    line-height: 1.455em;
}
#main .section {
    padding-bottom: 120px;
}
/* -----------------------------------------------------------------*/



/* 横スクロール（PC） */
.scroll-pg.year-wrap{
	overflow-x: scroll;
	overflow-y: hidden;
	max-width: 1060px;
	margin: 0 auto;
	-moz-box-shadow: 0px 0px 5px 1px rgba(120, 186, 224, 0.35);
	-webkit-box-shadow: 0px 0px 5px 1px rgb(120 186 224 / 35%);
	-ms-box-shadow: 0px 0px 5px 1px rgba(120, 186, 224, 0.35);
	box-shadow: 0px 0px 5px 1px rgb(120 186 224 / 35%);
	background-color: #fff;
	padding: 20px 30px;
	box-sizing: border-box;
}

@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, .scroll-pg-inner {
    width: auto;
	min-width: 2100px;
} /* IE11 */
}
.scroll-pg-inner{
	width: max-content;
}
.year-wrap .scroll-pg-inner>li{
    float: left;
}
.year-wrap .scroll-pg-inner>li img{
	height: 160px;
	width: auto;
}
.bx-prev {
  left: 10px;
  background: url(/-/Media/com/hadalabo/top/concept/220217/btn_prev01.png) no-repeat;
  background-size: contain;
  width: 36px;
  height: 36px;
  }

.bx-next {
  right: 10px;
  background: url(/-/Media/com/hadalabo/top/concept/220217/btn_next01.png) no-repeat;
  width: 36px;
  height: 36px;
  background-size: contain;
 }
.sec02_02 .clm-02{
	position: relative;
}
.bx-controls-direction span {
    position: absolute;
    top: 55%;
    outline: 0;
    max-width: 50px;
    max-height: 50px;
    text-indent: -9999px;
    z-index: 100;
}
.bx-controls-direction span:hover{
	opacity: 0.7;
}

@media screen and (min-width: 768px) and (max-width: 1120px) {
.scroll-pg.year-wrap{
    width: 95%;
}
}




/* INTRO */


.section_01_bg {
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec01_bg_l.jpg) left top repeat-x ;
    position:relative;
}
.section_01_bg:before {
	top: 0;
	left: 50%;
	width: 50%;
	height: 100%;
	/* height: 679px; */
	content: '';
	position: absolute;
	background: url(/-/Media/com/hadalabo/top/concept/220217/sec01_bg_r.jpg) right top repeat-x;
	z-index: 0;
}
.section_01{
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec01_bg_c.png) right top no-repeat;
    padding-top: 68px;
    padding-bottom: 276px;
    padding-left: 6.25%;
    position:relative;
    z-index: 10;
    /* font-size: 1.25vw; */
}
/* ie10 */
@media all and (-ms-high-contrast:none) {
    .section_01 {
		padding-bottom: 270px;
	}
}
/* ie11 */
_:-ms-lang(x)::-ms-backdrop, .section_01 {
		padding-bottom: 270px;
	}

.section_01 .cnt-01 {
    color: #fff;
    font-size: 1.857em;
    margin-bottom: 40px;
}
.section_01 .cnt-02 {
    color: #0084c8;
    font-size: 3.429em;
    font-weight: bold;
    line-height: 1em;
    letter-spacing: -0.025em;
    margin-bottom: 41px;
}
.section_01 .cnt-02>sup{
    font-size: 0.26em;
}
.section_01 .cnt-02-01 {
    font-weight: normal;
    letter-spacing: 0.075em;
}
.section_01 .cnt-03 {
    color: #555;
    font-size: 1.143em;
    line-height: 2em;
    letter-spacing: 0.075em;
}
/* 1.処方(PC) */
.sec02_01_bg {
    padding-bottom: 306px;
    padding-top: 140px;
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec0201_bg_01.jpg) center bottom #e5ecf6;
    background-size: cover;
}
.sec02_01 {}
.sec02_01 .ttl-01 {
    position: relative;
    width: 318px;
    margin: 0 auto 74px;
}
.sec02_01 .ttl-01 .cnt-ttl-01 {
    position: absolute;
    width: 220px;
    right: 0;
    top: 12px;
}
.sec02_01 .txt-wrap-01 {
    /* max-width: 830px; */
    /* width: 74.1%; */
    padding: 0 5% 0 20.5%;
    padding: 0 4.5% 0 20%;
}


/* 2.効果(PC) */
.sec02_02_bg {
    background: #eaf3f8;
    position:relative;
}
.sec02_02{
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec0202_bg_01.jpg) center top no-repeat;
    background-size: cover;
    padding-top: 138px;
    padding-bottom: 143px;
    position:relative;
    z-index: 10;
}
.sec02_02 {}
.sec02_02 .ttl-01 {
    width: 338px;
    margin: 0 auto 63px;
}
.sec02_02 .clm-01 {
    margin-bottom: 69px;
}
.sec02_02 .cnt-01 .txt-wrap-01{
    max-width: 860px;
    margin: 0 auto;
}
.sec02_02 .cnt-02 {}
.sec02_02 .clm-02 {}
.sec02_02 .ttl-02 {
	margin-bottom: 25px;
	text-align: center;
}
/* 3.品質(PC) */
.sec02_03_bg {
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec0203_bg_01.jpg) right 25% top no-repeat #d1dbe0;
	background-size: cover;
	padding-top: 160px;
	padding-bottom: 57px;
}
.sec02_03 {padding: 0 2%;}
.sec02_03 .ttl-01 {
    position: relative;
    width: 328px;
    margin-bottom: 99px;
    margin-left: 14px;
}
.sec02_03 .cnt-01 {
    text-align: center;
}
.sec02_03 .cnt-02 {}
.sec02_03 .cnt-03 .cnt-img-03{
    width: 471px;
}
.sec02_03 .clm-03{
    display: flex;
    margin-bottom: 48px;
}
.sec02_03 .clm-03 .cnt-img-01,
.sec02_03 .clm-03 .cnt-img-02 {
    width: 168px;
    text-align: center;
    margin-right: 30px;
    padding-top: 18px;
}

.sec02_03 .clm-03 .txt-wrap-02 .ttl-02 {
    margin-bottom: 15px;
}
.sec02_03 .cnt-02 .cnt-img-01 img {
	width: 124px;
	display: inline;
}
.sec02_03 .cnt-02 .txt-01 {
   /* width: 550px;*/
    width: 580px;
}
.sec02_03 .cnt-02 .note-01{
    color: #555;
    font-size: 0.750em;
}

/*価格*/
.sec02_04_2{
	background: url(/-/Media/com/hadalabo/top/concept/220217/sec0204_2_bg_01.jpg) center top no-repeat;
	background-size: auto;
	background-size: cover;
	padding-top: 200px;
	padding-bottom: 275px;
	position: relative;
	z-index: 10;
}
.sec02_04_2 .ttl-01 {
	width: 338px;
	margin: 0 auto 63px;
}
.sec02_04_2 .cnt-01 .txt-wrap-01 {
	max-width: 760px;
	margin: 0 auto;
}

/*環境*/
.sec02_05_2{
	background: url(/-/Media/com/hadalabo/top/concept/220217/sec0205_2_bg_01.jpg) center top no-repeat;
	background-size: auto;
	background-size: cover;
	padding-top: 210px;
	padding-bottom: 213px;
	position: relative;
	z-index: 10;
}
.sec02_05_2 .inner-03{
	padding:0 3%;
}
.sec02_05_2 .clm-01{
	max-width:600px;
	margin-left:auto;
}
.sec02_05_2 .ttl-01 {
	width: 338px;
	margin: 0 auto 63px;
}
.sec02_05_2 .cnt-01 .txt-wrap-01 {
	max-width: 860px;
	margin: 0 auto;
}

/* 結語 */
.sec02_04_bg {
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec0204_bg_01.jpg) center top no-repeat #ddeff8;
	background-size: cover;
    margin-bottom: 80px;
}
@media screen and (min-width: 1540px) {
.sec02_04_bg{
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec0204_bg_01.jpg) center bottom no-repeat #ddeff8;
	background-size: cover;
}
}
.sec02_04_inner_01 {
    padding: 250px 0 285px 0;
    align-items: center;
}
.sec02_04_inner_01 .cnt-img-01{
    max-width: 333px;
    width: 30%;
    margin: 0px 9px 0 40px;
}
.sec02_04_inner_01 .txt-wrap-03{
    color: #0084c8;
    font-size: 2.455em;
	font-weight: bold;
    text-align: center;
    line-height: 2em;
    letter-spacing: 0.075em;
}
/* 商品ラインナップボタン（PC） */
.section_04_bg{}
.section_04 {
    width: 580px;
    margin: 0 auto;
}
.section_04 .btn-02 a{
    color: #1484c8;
    font-size:  1.714em;
    font-weight: bold;
    border: 1px solid #1484c8;
    display: block;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 41px 55px 27px;
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec04_img_01.png) right center no-repeat #fff;
}
.section_04 .btn-02 a img{
    width: 71px;
    margin-bottom: 10px;
}
@media screen and (min-width: 960px) and (max-width: 1080px) {
.section_01{
    font-size: 1.25vw;
}
}
@media screen and (min-width: 768px) and (max-width: 960px) {
.section_01{
    /*width: 1060px;*/
    /*background: url(/-/Media/com/hadalabo/top/concept/220217/sec01_bg_c.png) right top no-repeat;*/
    /*background-size: 100%;*/
     font-size: 0.8em;
}
}

/****************************** BREAK POINT *******************************
タブレット Layout

******************************* BREAK POINT ******************************/
@media screen and (max-width: 768px) {
/* フォーマット設定*/
/*--------------------------------------------------------------------------
BASE(tablet,sp)
---------------------------------------------------------------------------*/

.concept {
	font-size: 3.6458vw;
}
.inner{
	width: 94%;
}
.inner-01 {
	width:100%;
}
.inner-02{
	width: 90%;
	margin: 0 auto;
}
.inner-03 {
	max-width: 90%;
	margin: 0 auto;
}

.toolBox01 {
	padding: 3% 0;
}
.pc-mode-01 {
	display: none !important;

}
.pc-mode-02 {
	display: none !important;
}
.pc-mode-03 {
	display: none !important;
}
.pc-mode-05 {
	display: none !important;
}
.sp-mode-01 {
	display: block !important;
}
.sp-mode-02 {
	display: inline !important;
}
.sp-mode-03 {
	display: inline-block !important;
}
.sp-mode-04 {
	display: table !important;
}
.sp-mode-05 {
	display: flex !important;
}

.bnr-sstnblty{
	background: url(/-/Media/com/hadalabo/top/210805/bg_bnr_sp.png)no-repeat left center ;
	text-align: center;
	padding:23.4375vw 5.7292vw 22vw;
	background-size: 100%;
	position: relative;
	z-index: 100;
}
.bnr-sstnblty img{
	border-radius:5px;
	box-shadow: -2px 2px 5px #dcdcdc;
}

/* ボタン */
.btn-02 a{}

/* タイトル(SP) */
.ttl-02 {
    font-size: 1.286em;
    letter-spacing: 0.075em;
    line-height: 1.455em;
}
/* テキスト(SP) */
.txt-01{
    font-size: 1em;
    line-height: 1.75em;
}
.txt-wrap-01 p{
 margin-bottom: 1.7607em;
 }
.txt-wrap-02 p{
    margin-bottom: 9.4167vw;
}
.txt-wrap-03 p{
    margin-bottom: 6vw;
}
#main .section {
    padding-bottom: 15vw;
}

/* 横スクロール (SP) */
.semicon-idx .scroll-pg::-webkit-scrollbar{
	width: 5px;
	background: #eee;
}
.scroll-pg.year-wrap::-webkit-scrollbar:horizontal{
	height: 5px;
	background: #eee;
}
.scroll-pg.year-wrap::-webkit-scrollbar-thumb{
	background: #666;
	border-radius: 2px;
}
.scroll-pg.year-wrap::-webkit-scrollbar-thumb:horizontal{
	background: #666;
	border-radius: 2px;
}
.scroll-pg.year-wrap{    
    width: 100%;
    height: 46.875vw;
    padding: 4.0365vw 2.7344vw 2.474vw;
    margin-bottom: 0.5em;
}
.sec02_02 .clm-02 .cnt-04 {
    font-size: 0.857em;
	color: #555;
}
.year-wrap .scroll-pg-inner>li img{
    height: 40.3646vw;
    width: auto;
}
.bx-prev {
  left: -3.5vw;
  background: url(/-/Media/com/hadalabo/top/concept/220217/btn_prev01.png) no-repeat;
  background-size: contain;
  width: 6.5104vw;
  height: 6.5104vw;
  }

.bx-next {
  right: -3.5vw;
  background: url(/-/Media/com/hadalabo/top/concept/220217/btn_next01.png) no-repeat;
  width: 6.5104vw;
  height: 6.5104vw;
  background-size: contain;
 }

/* INTRO(SP) */
.section_01_bg {
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec01_bg_01_sp.jpg) center top no-repeat;
    background-size: cover;
    padding-top: 9.28958vw;
}
.section_01_bg:before{
	content:none;
}
.section_01 {
    padding-bottom: 14.27188vw;
    font-size: 3.6458vw;
    padding-left: 0;
    padding-top: 0;
    background: none;
}
.section_01 .cnt-01 {
    font-size: 1.214em;
    margin-bottom: 13.4063vw;
}
.section_01 .cnt-02 {
    font-size: 2.929em;
    line-height: 1.175em;
    margin-bottom: 54.6875vw;
    letter-spacing: -0.025em;
}
.section_01 .cnt-02 .cnt-02-01 {
    font-size: 0.46em;
    /* letter-spacing: -0.0325em; */
    line-height: 1.5em;
    display: inline-block;
}
.section_01 .cnt-03 {
    font-size: 1em;
    color: #555;
    line-height: 1.750em;
    /* width: 88.5417vw; */
    /* margin: 0 auto; */
    letter-spacing: 0.035em;
}




/* 1.処方(SP) */
.sec02_01_bg {
    padding-bottom: 43.6198vw;
    padding-top: 23.4375vw;
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec0201_bg_01_sp.jpg) center bottom no-repeat;
    background-size: cover;
}
.sec02_01 {}
.sec02_01 .txt-wrap-01 {
    max-width: 100%;
    padding: 0;
}
.sec02_01 .ttl-01 {
    position: relative;
    width: 57.2917vw;
    margin: 0 auto 11.3698vw;
}
.sec02_01 .ttl-01 .cnt-ttl-01 {
    position: absolute;
    width: 40vw;
    right: -0.26vw;
    top: 2vw;
}



/* 2.効果(SP) */
.sec02_02_bg {
}

.sec02_02{
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec0202_bg_011_sp.jpg) center top no-repeat;
    background-size: cover;
    padding-top: 20.8333vw;
    padding-bottom: 20.8333vw;
    position:relative;
    z-index: 10;
}
.sec02_02 {}
.sec02_02 .ttl-01 {
    width: 62.8906vw;
    margin: 0 auto 11.208vw;
}
.sec02_02 .clm-01 {
    margin-bottom: 13vw;
}
.sec02_02 .cnt-01 .txt-wrap-01{
    max-width: 860px;
    margin: 0 auto;
}
.sec02_02 .cnt-02 {}
.sec02_02 .clm-02 {}
.sec02_02 .ttl-02 {
	margin-bottom: 4.0781vw;
	text-align: center;
}
/* 3.品質(SP) */
.sec02_03_bg {
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec0203_bg_01_sp.jpg) center top no-repeat #d1dbe0;
    background-size: cover;
    padding-top: 27.03438vw;
    padding-bottom: 9.7344vw;
}
.sec02_03 {
    padding: 0;
}
.sec02_03 .cnt-01 {
    position: relative;
    width: 60.9375vw;
    text-align: left;
    margin-bottom: 15.7031vw;
}
.sec02_03 .cnt-02 {}
.sec02_03 .cnt-03 {}
.sec02_03 .clm-03{
    display: flex;
    margin-bottom: 0;
    flex-direction: column;
}
.sec02_03 .clm-03 .cnt-img-01,
.sec02_03 .cnt-03 .cnt-img-02 {
    width: 100%;
    text-align: left;
    margin-right: 0;
    margin-bottom: 4.37292vw;
    display: flex;
    align-items: center;
}
.sec02_03 .clm-03 .txt-wrap-02 .ttl-02 {
    margin-bottom: 0;
}
.sec02_03 .cnt-02 .cnt-img-01 img {
	width: 16.0156vw;
	margin-right: 7.8125vw;
	margin-left: 3vw;
}
.sec02_03 .cnt-03 .cnt-img-02 img {
	width: 21.3542vw;
	margin-right: 5.2083vw;
}
.sec02_03 .cnt-02 .txt-01 {
    width: 100%;
}
.sec02_03 .cnt-02 .note-01{
    font-size: 0.857em;
}

.sec02_03 .cnt-03 .cnt-img-03{
    width: 75.9115vw;
    margin: 0 auto 5.4167vw;
}

/*価格(SP)*/
.sec02_04_2 {
	background: url(/-/Media/com/hadalabo/top/concept/220217/sec0204_2_bg_01_sp.jpg) center top no-repeat;
	background-size: auto;
	background-size: cover;
	padding-top: 20.8333vw;
	padding-bottom: 35.1562vw;
	position: relative;
	z-index: 10;
}
.sec02_04_2 .ttl-01{
	width: 62.7604vw;
	margin: 0 auto 10.4166vw;
}

/*環境(SP)*/
.sec02_05_2 {
	background: url(/-/Media/com/hadalabo/top/concept/220217/sec0205_2_bg_01_sp.jpg) center top no-repeat;
	background-size: auto;
	background-size: auto;
	background-size: cover;
	padding-top: 42.9687vw;
	padding-bottom: 12.8333vw;
	position: relative;
	z-index: 10;
}
.sec02_05_2 .clm-01 {
	max-width: none;
	margin-left: inherit;
}
.sec02_05_2 .ttl-01 {
	width: 63.151vw;
	margin: 0 auto 11.208vw;
}
/* 結語(SP) */
.sec02_04_bg {
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec0206_bg_01_sp.jpg) center bottom no-repeat;
    background-size: 100%;
    margin-bottom: 11.9792vw;
}
.sec02_04_inner_01 {
	max-width: 90%;
	padding:28.6458vw 0 34.9687vw 0;
	margin: 0 auto;
}
.sec02_04_inner_01 .txt-wrap-03{
    color: #0084c8;
    font-size: 1.6em;
    text-align: center;
    line-height: 1.667em;
    margin-bottom: 0;
}
/* 商品ラインナップボタン（PC） */
.section_04_bg{}
.section_04 {
    width: 91.1458vw;
}
.section_04 .btn-02 a{
    font-size: 1.214em;
    display: block;
    -webkit-border-radius: 1.3021vw;
    -moz-border-radius: 1.3021vw;
    border-radius: 1.3021vw;
    padding: 5.5990vw 7.8125vw 3.25vw;
    background: url(/-/Media/com/hadalabo/top/concept/220217/sec04_img_01_sp.png) right center no-repeat #fff;
    background-size: 100%;
}
.section_04 .btn-02 a img{
    width: 13.8021vw;
    margin-bottom: 2.2552vw;
}

}

/****************************** BREAK POINT *******************************
SP Layout
******************************* BREAK POINT ******************************/
@media screen and (max-width: 480px) {
/*--------------------------------------------------------------------------
BASE(tablet,sp)
---------------------------------------------------------------------------*/
#hadalab_container{
    padding-top: 17vw !important;
}
}