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

/*------------------------------------------------------------------------------
hwe
------------------------------------------------------------------------------*/

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

main{
	
	    min-width: inherit !important;
    background-image: url(../img/bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    overflow-y: hidden;
}



.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;
}

.btn_move{
	width: 100%;
}

.cv01 .inner-block{
	    width: 90%;
    margin: 10% auto;
}

.cv01 .cv_title{
	    margin-bottom: 6%;
}

.cv01 .cv_main{
	margin-bottom: 8%;
}
.contents01 .section01{
	background-image: url(https://jurlique-japan.com/topics/jurlique_starterkit/img/contents01_back01.jpg);
    background-size: cover;
    text-align: center;
}

.contents01 .section01 img{
    width: 85%;
    margin: 16% auto 10%;
}

.contents01 .section02{
	background-image: url(https://jurlique-japan.com/topics/jurlique_starterkit/img/contents01_back02_02.jpg);
    background-size: cover;
    text-align: center;
}

.contents01 .section02 .text02{
    width: 88%;
    margin: 14% auto 6%;
}

.contents01 .section02 .text03{
        width: 88%;
    margin: 8% auto 16%;
}

.contents02{
	background: #fcfcf2;
	}

.contents02 .title{
	    width: 76%;
    margin: auto;
    padding-top: 18%;
}

.contents02 .text{
    width: 90%;
    margin: 8% auto 0;
}

.contents02 .text .text01{
    width: 100%;
    margin: 10% 0 6%;
}

.contents02 .text .text02{
        margin: 6% auto 10%;
}

.contents02 .text .text03{
    margin: 4% auto 0;
    padding-bottom: 10%;
}


.cv02{
	width: 90%;
    margin: 16% auto;
}

.cv02 .cv_main{
	margin-bottom: 8%;
}

.contents03 .about{
	background: #3d503b;
	}

.contents03 .about .title{
  width: 80%;
    margin: 16% 0 4% 7%;
}

.contents03 .about .inner{
 width: 86%;
    margin: auto;
	    padding-bottom: 4%;
		
}

.contents03 .farm{

background: #fbf1e1;
		
}

.contents03 .farm .section01 .center{
width: 88%;
    margin: auto;
    padding-top: 16%;
}

.contents03 .about .text01{
    margin: 10% 0;
}
.contents03 .farm .section01 .text01{
margin: 6% 0 10%;
}

.contents03 .farm .section01 .title02{
margin: 10% 0 2%;
}

.contents03 .farm .rose{
	width: 95%;
    margin: 0 0 0 8%;
}

.contents03 .farm .mash{
	
    width: 95%;
    margin: 0 0 14% 8%;
}

.contents03 hr{
	    width: 90%;
    margin: auto;
    color: #56413b;
}

.contents03 .section02 .center{
    width: 88%;
    margin: 14% auto 10%;
}

.contents03 .farm .filtration{
    width: 95%;
}

.contents03 .farm .ashing{
	width: 95%;
        margin: 8% 0 18% 8%;
}

.contents04 .howto{
	    width: 90%;
    margin: 10% auto 18%;
	}

.contents04 .text02{
	     margin-top: 10%;
	}




.contents05{
	background-image: url(https://jurlique-japan.com/topics/jurlique_starterkit/img/contents05_back_02.jpg);
    background-size: cover;
    text-align: center;
	}

.contents05 img{
	width: 90%;
    margin: 48% 0 34%;
}

.contents06{
	background-image: url(https://jurlique-japan.com/topics/jurlique_starterkit/img/contents06_back.jpg);
    background-size: cover;
	}

.topics {
    background-color: transparent;
	    text-align: center;
}

.contents06 .title{
text-align: center;
}

.contents06 .title .title01{
width: 72%;
    margin: 16% auto 7%;
}

.contents06 .title .title02{
    width: 80%;
    margin: 0 auto 10%;
}
.contents06 .title .text{
    width: 86%;
    margin: 0 auto 6%;
}

.contents06 .topics .title{
    width: 80%;
       margin: 0 auto 5%;
}

.contents06 .topics .text{
    width: 90%;
    margin: auto;
}
.contents06 .topics01 .img{
    width: 90%;
    margin: 0 auto 5%;
} 

.contents06 .topics02 .img{
    width: 90%;
    margin: 0 auto 5%;
} 

.contents06 .topics02 .title{
       width: 81%;
    margin-top: 4%;
}

.contents06 .topics03{
    padding-bottom: 5%;
} 

.contents06 .topics03 .img{
    width: 90%;
    margin: 0 auto 5%;
} 

.contents06 .topics03 .title{
   width: 86%;
	margin-top: 4%;
}



.contents07 {
       background: #b57e79;
}

.contents07 .title{
         width: 65%;
    margin: 0 auto 6%;
    padding-top: 12%;
}

.contents07 .comment{
	width: 90%;
    margin: auto;
}

.contents07 .comment img{
	margin-bottom: 4%;
}

.contents07 .comment .com3{
	margin-bottom: 16%;
}
.sp-copy {
	max-width: 520px;
    margin: 0 auto 0;
    text-align: center;
    background-color: #5d5848;
    padding: 14px 20px;
    letter-spacing: -0.03em;
    font-size: 14px;
    color: #fff;
}

.floating {
	 position: fixed;
    bottom: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    transition: all 0.3s ease 0s;
    visibility: visible;
    opacity: 1;
}

.floating.is-hidden {
    visibility: hidden;
    opacity: 0;
}


.floating_btn {
  max-width: 100%; /* 画像の最大幅 */
}



@media screen and (min-width: 481px) {
	/* ------------------481px以上に適用されるCSS（タブレット）------------------- */
	
/*common*/
	
	.spOnly{
		display: none!important;
	}
	body{
		max-width: inherit;
	}
	main{
		    min-width: 481px!important;
	}
	
	.floating_btn {
    max-width: 520px;
}
	.floating {
		    display: flex;
		justify-content: center;
		
		}
	.floating.is-hidden {
    visibility: hidden;
    opacity: 0;
}
	
	footer{
		    background-color: #edf6fb;
	}
	
	.contents5 .goals {
    text-align: center;
    padding: 174% 0 24%;
}
		
}