/*------------hyaluronan-page-2026/05/27-------------*/
.hyaluronan_box_kv {
    background: url(../images/img/hyaluronan_box_kv.jpg) center;
	background-position: top center;
}
.hyaluronan_box{
    margin: 0 auto;
    text-align: center;
}
.hyaluronan_box *{
	font-family: 'Noto Sans TC', sans-serif;
}
.hyaluronan_box h1,.hyaluronan_box h2,.hyaluronan_box h3{
	text-indent: 0;
}
.hyaluronan_box > div {
    margin: 0 auto;
    text-align: center;
}
.hyaluronan_box1,.hyaluronan_box3,.hyaluronan_box4,.hyaluronan_box5,.hyaluronan_box6,.hyaluronan_box7{
	position: relative;
}
.hyaluronan_box1{
	background: url(../images/img/hyaluronan_01.jpg) no-repeat left bottom;
	width:1080px; height:410px;
}
.hyaluronan_box1 > div{
	position: absolute;
}
.hyaluronan_kv_t{
	text-align: start;
	top: 108px;
	left: calc(50% - 100px);
}
.hyaluronan_kv_t h5{
	font-size: 32px;
	font-weight: 500;
	letter-spacing: 2px;
	color: #474747;
	margin-bottom: 18px;
}
.hyaluronan_kv_t h1{
	font-size: 45px;
	font-weight: 900;
	letter-spacing: 1px;
	color: #474747;
}
.hyaluronan_b{
	color: #2a3fab;
}
.hyaluronan_y{
	font-size: 51px;
	color: #b5873c;
}
.hyaluronan_kv_t2{
	top: 296px;
	left: calc(50% - 50px);
}
.hyaluronan_kv_t2 h4{
	font-size: 40px;
	font-weight: 900;
	letter-spacing: 1px;
	padding-bottom: 18px;
	color: #e3ce65;
	text-align: center;
}
.hyaluronan_kv_t2 p,.hyaluronan_box2_t p,.hyaluronan_box_h2{
	font-size: 28px;
	font-weight: 700;
	letter-spacing: 2px;
	color: #fff;
}
.hyaluronan_box2_t p{
	font-size: 32px;
}
.hyaluronan_box2_t{
	padding-top: 380px;
}
.hyaluronan_box2_t h5{
	font-size: 35px;
	font-weight: 800;
	color: #4292e1;
	margin-bottom: 25px;
	/* position: relative;
	z-index: 1;
	display: inline-block; */
	text-shadow:
		0 0 2px #fff,
		0 0 4px #fff,
		2px 0 0 #fff,
		-2px 0 0 #fff,
		0 2px 0 #fff,
		0 -2px 0 #fff,
		2px 2px 0 #fff,
		-2px -2px 0 #fff,
		2px -2px 0 #fff,
		-2px 2px 0 #fff;
}

.hyaluronan_r{
	color: #da0f15;
}
.hyaluronan_p{
	color: #865ba7;
}
.hyaluronan_box2{
	background: url(../images/img/hyaluronan_02.jpg) no-repeat left bottom;
	width:1080px; height:541px;
}
.hyaluronan_box3{
	background: url(../images/img/hyaluronan_03.jpg) no-repeat left bottom;
	width:1080px; height:315px;
}
.hyaluronan_box_h2,.hyaluronan_box_ul{
	text-align: start;
}
.hyaluronan_box_h2{
	filter: drop-shadow(0 0 6px rgba(76,39,140,0.8));
	padding: 18px 0 0px 295px;
}
.hyaluronan_box_h2 span{
	color: #e3ce65;
}
.hyaluronan_box_ul{
	font-size: 19px;
	font-weight: 600;
	color: #4d4d4d;
	padding: 36px 0 0px 367px;
}
.hyaluronan_box_ul span{
	font-size: 12px;
}
.hyaluronan_box_ul li::before{
  content: "◆";
  font-size: 12px;
  margin-right: 5px;
  vertical-align: middle;
}
.hyaluronan_box_tag{
	font-size: 25px;
	font-weight: 500;
	letter-spacing: 1px;
	color: #fff;
	position: absolute;
	top: 4%;
	left: 15.5%;
	text-shadow:
		0 0 4px rgba(130,103,7,0.3),
		0 0 4px rgba(130,103,7,0.3),
		2px 0 4px rgba(130,103,7,0.3),
		-2px 0 4px rgba(130,103,7,0.3),
		0 2px 4px rgba(130,103,7,0.3),
		0 -2px 4px rgba(130,103,7,0.3),
		2px 2px 4px rgba(130,103,7,0.3),
		-2px -2px 4px rgba(130,103,7,0.3),
		2px -2px 4px rgba(130,103,7,0.3),
		-2px 2px 4px rgba(130,103,7,0.3);
}
.hyaluronan_box4 .hyaluronan_box_tag{
	left: 16.5%;
}
.hyaluronan_box6 .hyaluronan_box_tag{
	left: 16.5%;
	top: 5%;
}
.hyaluronan_box4{
	background: url(../images/img/hyaluronan_04.jpg) no-repeat left bottom;
	width:1080px; height:318px;
}
.hyaluronan_box5{
	background: url(../images/img/hyaluronan_05.jpg) no-repeat left bottom;
	width:1080px; height:248px;
}
.hyaluronan_box6{
	background: url(../images/img/hyaluronan_06.jpg) no-repeat left bottom;
	width:1080px; height:212px;
}
.hyaluronan_box7{
	background: url(../images/img/hyaluronan_07.jpg) no-repeat left bottom;
	width:1080px; height:479px;
}
.hyaluronan_box7 h2{
	padding-top: 32px;
	font-size: 35px;
	font-weight: 800;
	color: #0237aa;
	text-shadow:
		0 0 2px #fff,
		0 0 4px #fff,
		2px 0 0 #fff,
		-2px 0 0 #fff,
		0 2px 0 #fff,
		0 -2px 0 #fff,
		2px 2px 0 #fff,
		-2px -2px 0 #fff,
		2px -2px 0 #fff,
		-2px 2px 0 #fff;
}
.hyaluronan_box7 h3{
	font-size: 25px;
	font-weight: 600;
	color: #fff;
	position: absolute;
	top: 25.5%;
}
.hyaluronan_box7_t1{
	left: calc(50% - 388px);
}
.hyaluronan_box7_t2{
	left: 50%;
	transform: translateX(-50%);
}
.hyaluronan_box7_t3{
	left: calc(50% + 222px);
}


@media (max-width: 1218px) {
    /*------------hyaluronan-page-2026/05/27-------------*/
    .hyaluronan_box1{
        background: url(../images/img/hyaluronan_m_01.jpg) no-repeat left bottom;
        width: 640px;height:680px;background-size: contain;
    }
    .hyaluronan_kv_t{
        top: 8%;
        left: 5%;
    }
    .hyaluronan_kv_t h5{
        letter-spacing: 4px;
    }
    .hyaluronan_kv_t h1{
        font-size: 47px;
    }
    .hyaluronan_y{
        font-size: 53px;
    }
    .hyaluronan_kv_t2{
        top: 84.5%;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
    }
    .hyaluronan_box2{
        background: url(../images/img/hyaluronan_m_02.jpg) no-repeat left bottom;
        width: 640px;height:702px;background-size: contain;
    }
    .hyaluronan_box2_t{
        padding-top: 35px;
    }
    .hyaluronan_box2_t h5{
        width: 75%;
        line-height: 1.3;
        margin: 0 auto 453px;
    }
    .hyaluronan_box2_t p{
        letter-spacing: 2px;
    }
    .hyaluronan_box3{
        background: url(../images/img/hyaluronan_m_03.jpg) no-repeat left bottom;
        width: 640px;height:532px;background-size: contain;
    }
    .hyaluronan_box_tag,.hyaluronan_box_h2{
        font-size: 30px;
    }
    .hyaluronan_box_tag{
        top: 2%;
        left: 13%;
    }
    .hyaluronan_box4 .hyaluronan_box_tag{
        top: 2.5%;
    }
    .hyaluronan_box4 .hyaluronan_box_tag,.hyaluronan_box6 .hyaluronan_box_tag{
        left: 16%;
    }
    .hyaluronan_box5 .hyaluronan_box_tag{
        top: 4%;
    }
    .hyaluronan_box_h2{
        padding: 20px 0 0px 130px;
        text-align: center;
    }
    .hyaluronan_box3 .hyaluronan_box_h2 span,.hyaluronan_box4 .hyaluronan_box_h2 span,.hyaluronan_box5 .hyaluronan_box_h2 span{
        display: inline-block;
        width: 100%;
        margin-bottom: 4px;
    }
    .hyaluronan_box_ul{
        font-size: 25px;
    }
    .hyaluronan_box_ul span{
        font-size: 16px;
    }
    .hyaluronan_box3 .hyaluronan_box_ul,.hyaluronan_box4 .hyaluronan_box_ul{
        padding: 185px 0 0px 52px;
    }
    .hyaluronan_box5 .hyaluronan_box_ul,.hyaluronan_box6 .hyaluronan_box_ul{
        padding: 32px 40px 0px 200px;
    }
    .hyaluronan_box_ul li{
        margin-bottom: 10px;
    }
    .hyaluronan_box5 .hyaluronan_box_ul li,.hyaluronan_box6 .hyaluronan_box_ul li{
    text-indent: -17px;
    }
    .hyaluronan_box4{
        background: url(../images/img/hyaluronan_m_04.jpg) no-repeat left bottom;
        width: 640px;height:613px;background-size: contain;
    }
    .hyaluronan_box5{
        background: url(../images/img/hyaluronan_m_05.jpg) no-repeat left bottom;
        width: 640px;height:338px;background-size: contain;
    }
    .hyaluronan_box6{
        background: url(../images/img/hyaluronan_m_06.jpg) no-repeat left bottom;
        width: 640px;height:279px;background-size: contain;
    }
    .hyaluronan_box7{
        background: url(../images/img/hyaluronan_m_07.png) no-repeat left bottom;
        width: 640px;height:739px;background-size: contain;
        background-position: center top;
    }
    .hyaluronan_box7 h3{
        top: 14.5%;
    }
    .hyaluronan_box7_t1{
        left: calc(50% - 236px);
    }
    .hyaluronan_box7_t2{
        left: calc(50% + 82px);
        transform: none;
    }
    .hyaluronan_box7 h3.hyaluronan_box7_t3{
        top: 57.6%;
        left: 50%;
        transform: translateX(-50%);
    }
    /*------------hyaluronan-page-2026/05/27 END-------------*/
}


@media (max-width: 991px) {
    .hyaluronan_box_h2{
        padding: 25px 0 0px 130px;
    }
}

@media screen and (max-width: 768px){
    .hyaluronan_box3 .hyaluronan_box_h2 span,.hyaluronan_box4 .hyaluronan_box_h2 span,.hyaluronan_box5 .hyaluronan_box_h2 span{
        margin-bottom: 10px;
    }
    .hyaluronan_box3 .hyaluronan_box_ul,.hyaluronan_box4 .hyaluronan_box_ul{
        padding: 200px 0 0px 52px;
    }
    .hyaluronan_box5 .hyaluronan_box_ul,.hyaluronan_box6 .hyaluronan_box_ul{
        padding: 48px 40px 0px 200px;
    }
}

@media screen and (max-width: 640px) {
    .hyaluronan_box{background-color:#4292e1;}
    .hyaluronan_box1,.hyaluronan_box2,
    .hyaluronan_box3,.hyaluronan_box4,
    .hyaluronan_box5,.hyaluronan_box6,
    .hyaluronan_box7{
        width:100%; background-position:left top;
    }
    .hyaluronan_box7 h3.hyaluronan_box7_t3{
        top: 56.3%;
    }
    .hyaluronan_box1{background-color: #0c2372;}
}

@media screen and (max-width: 600px){
    .hyaluronan_kv_t h1,.hyaluronan_kv_t h5,.hyaluronan_kv_t2 h4,.hyaluronan_kv_t2 p{
        letter-spacing: 0;
    }
    .hyaluronan_kv_t h1{
        font-size: 44px;
    }
    .hyaluronan_kv_t2{
        top: 79%;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
    }
    .hyaluronan_kv_t2 h4{
        font-size: 36px;
    }
    .hyaluronan_kv_t2 p{
        font-size: 24px;
    }
    .hyaluronan_box2_t p,.hyaluronan_box_tag{
        font-size: 28px;
    }
    .hyaluronan_box4 .hyaluronan_box_tag,.hyaluronan_box6 .hyaluronan_box_tag{
        left: 15.5%;
    }
    .hyaluronan_box2_t h5{
        margin: 0 auto 430px;
        width: 78%;
    }
    .hyaluronan_box_h2{
        padding: 20px 0 0px 130px;
        font-size: 28px;
    }
    .hyaluronan_box_ul{
        font-size: 22px;
    }
    .hyaluronan_box3 .hyaluronan_box_ul,.hyaluronan_box4 .hyaluronan_box_ul{
        padding: 195px 0 0px 52px;
    }
    .hyaluronan_box5 .hyaluronan_box_ul{
        padding: 38px 50px 0px 185px;
    }
    .hyaluronan_box6 .hyaluronan_box_ul{
        padding: 48px 50px 0px 185px;
    }
    .hyaluronan_box7 h3{
        font-size: 23px;
        top: 13.5%;
    }
    .hyaluronan_box7_t1{
        left: calc(50% - 216px);
    }
    .hyaluronan_box7_t2{
        left: calc(50% + 78px);
    }
    .hyaluronan_box7 h3.hyaluronan_box7_t3{
        top: 54%;
    }
}


@media screen and (max-width: 576px) {
    .hyaluronan_box1{height:610px;}
    .hyaluronan_box2{height:640px;}
    .hyaluronan_box3{height:480px;}
    .hyaluronan_box4{height:550px;}
    .hyaluronan_box5{height:320px;}
    .hyaluronan_box6{height:250px;}
    .hyaluronan_box7{height:680px;}
}

@media screen and (max-width: 500px) {
    .hyaluronan_box1{height:520px;}
    .hyaluronan_box2{height:550px;}
    .hyaluronan_box3{height:420px;}
    .hyaluronan_box4{height:480px;}
    .hyaluronan_box5{height:270px;}
    .hyaluronan_box6{height:220px;}
    .hyaluronan_box7{height:580px;}
}

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

    .hyaluronan_box1{height:460px;}
    .hyaluronan_box2{height:490px;}
    .hyaluronan_box3{height:370px;}
    .hyaluronan_box4{height:430px;}
    .hyaluronan_box5{height:230px;}
    .hyaluronan_box6{height:190px;}
    .hyaluronan_box7{height:500px;}
}

@media screen and (max-width: 390px) {
    .hyaluronan_box1{height:400px;}
    .hyaluronan_box2{height:430px;}
    .hyaluronan_box3{height:320px;}
    .hyaluronan_box4{height:380px;}
    .hyaluronan_box5{height:210px;}
    .hyaluronan_box6{height:170px;}
    .hyaluronan_box7{height:450px;}
}


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

    .hyaluronan_box1{height:350px;}
    .hyaluronan_box2{height:380px;}
    .hyaluronan_box3{height:280px;}
    .hyaluronan_box4{height:330px;}
    .hyaluronan_box5{height:180px;}
    .hyaluronan_box6{height:150px;}
    .hyaluronan_box7{height:390px;}
}

@media screen and (max-width: 320px) {
    .hyaluronan_box1{height:310px;}
    .hyaluronan_box2{height:350px;}
    .hyaluronan_box3{height:270px;}
    .hyaluronan_box4{height:310px;}
    .hyaluronan_box5{height:170px;}
    .hyaluronan_box6{height:140px;}
    .hyaluronan_box7{height:370px;}
}

@media screen and (max-width: 275px) {
    .hyaluronan_box1{height:290px;}
    .hyaluronan_box2{height:310px;}
    .hyaluronan_box3{height:230px;}
    .hyaluronan_box4{height:270px;}
    .hyaluronan_box5{height:150px;}
    .hyaluronan_box6{height:120px;}
    .hyaluronan_box7{height:320px;}
}