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

/*------------------------------------------------------------------------------
uvdefencedailylotion
------------------------------------------------------------------------------*/

section{
	width: inherit;
	padding:inherit;
	margin: 0 auto!important;
}

main{
	/*background-image: linear-gradient(90deg, rgb(255 255 255), rgb(233 244 250));*/
	min-width: inherit !important;
    background-image: url(../img/main_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    overflow-y: hidden;
}

main section{
	padding:0!important;
}

picture{
	display: block;
}

.main-contents{
	background: #fff;
    box-shadow: 0 10px 25px 0 rgb(0 0 0 / 26%);
	width: 100%;
    max-width: 520px;
    margin: 0 auto;
    overflow: hidden;
	height: auto;
}

.fv .fv_main{
	/*background-image:url(https://jurlique-japan.com/topics/uvdefencedailylotion/img/fv_back01.jpg);
	background-size: cover;
	text-align: center;
	height: auto;*/
}

.fv .fv_main .fv_product img{
	width: 105%;
    margin: 0;
    height: auto;
}

.fv_text {
	background-image:url(https://jurlique-japan.com/topics/uvdefencedailylotion/img/fv_back02_02.jpg);
	background-size: cover;
	text-align: center;
	height: auto;
}

.fv_text .decoration img{
	margin-top: -21%;
}

.fv_text .main-text{
	width: 75%;
    margin: -5% auto 4%;
}
.fv_text .main-icon{
	width: 86%;
        padding: 2% 0 11%;
    margin: 0% auto;
}

.cv1 {background-image:url(https://jurlique-japan.com/topics/uvdefencedailylotion/img/cv_back01_2026.jpg);
	background-size: cover;
	text-align: center;
	height: auto;
	
}

.cv2{background-image:url(https://jurlique-japan.com/topics/uvdefencedailylotion/img/cv_back02_2026.jpg);
	background-size: cover;
	text-align: center;
	height: auto;
	
}

.cv_base{
	    position: relative;
}

.cv_base .base_white{
width: 90%;
    margin: 0 auto;
    padding: 36% 0 4%;
}

.cv_above{
	    position: absolute;
    top: 50%;
    left: 9%;
    width: 80%;
}

.cv_btn{
	position: absolute;
    top: 87%;
    left: 9%;
    margin-bottom: 9%;
}



.btn_move{
	width: 90%;
}

.contents01 .title{
	    width: 80%;
    margin: 16% auto 6%;
}

.contents01 .onayami{
width: 90%;
    margin: 0 auto 12%;
}

.contents01 .recommend{
	width: 84%;
    margin: 4% auto 8%;
}



.contents02 .point ul{
	display: flex;
	    width: 90%;
    margin: 4% auto 2%;
}


.contents02 .point li{
	width: 49%;
    background: #fff;
    padding: 1%;
	height: auto;
	
}


.contents03 .text
{background-image:url(https://jurlique-japan.com/topics/uvdefencedailylotion/img/contents03_back_2026_02.jpg);
	background-size: cover;
	text-align: center;
	height: auto;
	
}

.contents03 .text img{
       width: 85%;
    margin: 0 auto;
    padding: 34% 0 4%;
	
	}

.contents03 .about{
    width: 84%;
    margin: 6% auto 12%;
	}

.contents03 .about img{
   margin-bottom: 2%;
	}


.contents04
{background-image:url(https://jurlique-japan.com/topics/uvdefencedailylotion/img/contents04_back_03.jpg);
	background-size: cover;
	text-align: center;
	height: auto;
	margin-top: 6%;
	
}

.contents04 .text{
	    width: 88%;
    margin: auto;
}
.contents04 .text img{
        padding: 34% 0 80%;
    margin: 0% auto;
}

.contents04 .about{
width: 86%;
    margin: auto;
    padding-bottom: 30%;
}


.contents05 .text
{background-image:url(https://jurlique-japan.com/topics/uvdefencedailylotion/img/contents05_back_03.jpg);
	background-size: cover;
	text-align: center;
	height: auto;
	margin-top: 6%;
	
}

.contents05 .text img{
width: 76%;
padding: 100% 0 6%;
    margin: 0% auto;
	}


.contents05 .about{
width: 80%;
    margin: 4% auto 16%;
	}


.contents07 .base
{
	position: relative;
}


.contents07 .above
{
	    position: absolute;
    top: 14%;
    right: 0;
}

.contents07 .above .text
{
	width: 75%;
    margin: 0% 0 0 13%;
}

.contents07 .above .promis
{
	width: 87%;
    margin: 6% 0 18% 13%;
}


.contents06
{background-image:url(https://jurlique-japan.com/topics/uvdefencedailylotion/img/contents06_back.jpg);
	background-size: cover;
	text-align: center;
	height: auto;
	
}

.contents06 .voice{
	 width: 84%;
    margin: auto;
    padding: 30% 0 8%;
}

.contents06 .voice img{
	margin-bottom: 4%;
}

.sp-copy {
    max-width: 520px;
    margin: 0 auto 0;
    text-align: center;
    background-color: #4ba2d1;
    padding: 14px 20px;
    letter-spacing: -0.03em;
    font-size: 14px;
    color: #fff;
}

@media screen and (min-width: 481px) {
	/* ------------------481px以上に適用されるCSS（タブレット）------------------- */
	
/*common*/
	body{
		max-width: inherit;
	}
	main{
		    min-width: 481px!important;
		margin: 4% 0 0;
	}
	
	.floating_btn {
    max-width: 520px;
}
	.floating {
		    display: flex;
		justify-content: center;
		
		}
	.floating.is-hidden {
    visibility: hidden;
    opacity: 0;
}
	

	.contents5 .goals {
    text-align: center;
    padding: 174% 0 24%;
}
		
}