@charset "utf-8";

body{
	font-family:'Noto Sans JP',serif;
	animation: fadeIn 0.5s ease 0s 1 normal;
	-webkit-animation: fadeIn 0.5s ease 0s 1 normal;
}


@keyframes fadeIn{
0% {opacity: 0}
100% {opacity: 1}
}

@-webkit-keyframes fadeIn{
0% {opacity: 0}
100% {opacity: 1}
}



.blinking{
	-webkit-animation:blink 1.0s ease-in-out infinite alternate;
    -moz-animation:blink 1.0s ease-in-out infinite alternate;
    animation:blink 1.0s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}




a.btn-a:link,
a.btn-a:visited{background-color:#003559;color:#fff;text-align:center;}





header{width:1020px;margin:0 auto;padding-top:20px;}


header{
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
}

.header_logo{width:120px;}
.header_logo img{width:100%;}
.header_logo a{display:block;}

header li{display:inline-block;padding:0 20px;font-size: 0.9rem;vertical-align: middle;}
header li a.disabled:link,
header li a.disabled:visited{pointer-events: none;color:#BBB;}
header li a:link,
header li a:visited{color:#003559;}

header li a span{font-size:1.0rem;margin-left:5px;display:inline-block;}


header .header_title{background:#003559;color:#fff;margin-top:40px;padding:10px 0 10px 30px;border-radius:30px;}
header .header_title span{
	font-size:0.7rem;
	margin-left:15px;
	padding-left:15px;
	letter-spacing:2px;
	font-weight:700;
	border-left:1px solid #fff;
}

footer{width:1020px;margin:10px auto 0 auto;text-align:center;}
footer.footer_index{width:100%;margin:40px 30px 0 -8%;text-align:center;}

.copyright{font-size:0.8rem;margin-top:20px;padding-bottom:40px;}



br.br_sp{display:none;}
br.br_pc{display:block;}

a{text-decoration:none;}
a{transition-property: all;transition: 0.3s linear;}
a:hover{opacity:0.6;}

.a_style_box{text-align:center;margin-top:40px;}

.a_style_box a{display:inline-block;padding:5px 20px;border:1px solid #333;text-decoration:none;}
.a_style_box a:link,
.a_style_box a:visited{color:#333;}
.a_style_box a:hover{color:#fff;background:#003559;}

.ham_menu{display:none;}

ul.dropdwn_menu{display:none;position:absolute;z-index:999;}
ul.dropdwn_menu li{border-bottom:1px solid #069;display:block;padding:10px;background:rgba(255,255,255,0.9);}


.container{width:1020px;margin:20px auto;}


.contents{margin:50px auto;}
.contents h1{margin-bottom:30px;}



.header_nav{/*width:80%;*/}
.header_index .header_nav{width:auto;width: 90%;text-align: center;min-width: 920px;}
.header_index .header_nav ul{margin-bottom:0;padding-left: 0;}


/* -----INDEX-----*/
.logo {
	width:25%;
	position:absolute;
	left:-5%;
	top:-40px;
	z-index:99;
	padding-left:1%;
}

body.body_index{
	padding:0 0 0 9%;
	border-left:80px solid #003559;
	color:#003559;
	min-height:100vh;
}
.page_index{width:100%;}
.page_index .contents{margin-bottom:0;}

.header_index{padding-top:20px;width:auto;}
.header_index .header_logo{display:none;}
.page_index,
.page_index .main_visual{margin-bottom:0;}
.main_visual img{width:80%;margin:auto;}
p.icon_news{
	position: absolute;
	display: inline-block;
	padding: 5px 25px;
	border: 2px solid #003559;
	letter-spacing: 2px;
	bottom: 35%;
	left: -8%;
	z-index: 99;
	background-color:rgba(255,255,255,0.1);
	font-weight:500;
}
p.icon_news span{font-size:1.6rem;font-weight:700;margin-right:10px;}

.main_visual{width:100%;position:relative;margin:50px auto 20px auto}

.slide_custom1 .slick-slide:not(.slick-center) {transform: scale(0.9);}




.index-line-over{margin:80px 0 100px 0;width:100%;position:relative;}

.index-line h2{margin-bottom:20px;}

.index-line-panel{width:900px;display:flex;justify-content: space-between;/*background-color:#dcdddd;*/}
.index-line-panel figure{text-align:center;width:200px;}
.index-line-panel figure img{width:100%;}
.index-line-panel figcaption{background:#FFF;padding: 20px 0;position:relative;}

.index-line-panel figcaption span{
	font-family: 'Noto Serif JP', serif;
	font-size:2rem;
	font-weight: 600;
	position:absolute;
	left:10px;
	top:-30px;
}


.index-line-panel a:link,
.index-line-panel a:visited{color:#003559;}





.index-line-panel-gray{
	background:#dcdddd;
	position: absolute;
	width:111%;
	height: 220px;
	left:-11%;
	bottom: -40px;
	z-index:-1;
}

.index-media{display:flex;margin-bottom:40px;}



.media-blog{width:350px;padding-right:60px;border-right:1px solid #003559;}
.media-mas{width:500px;padding-left:60px;}


.media-blog h1,
.media-blog h2{text-align:center;}

.media-blog h1{margin-bottom:30px;}

.media-blog h1 img{width:30%;}

.media-blog-day,
.media-blog-title{margin:10px 0;font-weight:700;}
.media-blog-title{/*font-size:1.1rem;*/}
.media-blog-part p{font-size:0.9rem;}

.media-blog a.btn-a{display:block;padding:10px 0;margin-top:20px;background:#e9e9e9;pointer-events:none;}

.media-mas{text-align:center;}
.media-mas h1{margin:20px auto 0 auto;font-size:1.1rem;}
.media-mas p img{width:100%;}
.media-mas-img{margin-top:40px;}


.index-insta{margin-bottom:20px;}
.index-insta p a{display:flex;align-items:center;}
.index-insta p a i{margin-right:8px;}


.index-insta-inner{font-size:0;margin-top:10px;}
.index-insta-inner a{display:inline-block;width:200px;height:200px;background-size:cover;}
.index-insta a:link,
.index-insta a:visited{color:#003559;}

.index-insta-inner a:last-child{display:none;}


.media-blog p img{width:100%;}





/* -----COSME_ALL2 -----*/
.cosume-bottom{background-color:#003559;color:#fff;text-align:center;padding:40px 0;}

.cosume-bottom h1{
	color: #EEFFFF;
	font-family: 'Noto Serif JP', serif;
	font-size: 1.2rem;
	font-weight: 400;
}
.cosume-bottom ul{margin:0;padding:0;font-size:0;}
.cosume-bottom li{display:inline-block;border-right:1px solid #fff;font-size:1rem;}
.cosume-bottom li:last-child{border:none;}
.cosume-bottom li a{display:inline-block;color:#fff;padding: 0 30px;}



/* -----COSME_ALL -----*/
.prod_panel-box{display:flex;flex-wrap:wrap;justify-content:space-between;}
.prod_panel{box-sizing:border-box;width:32%;padding:20px 0;margin-bottom:10px;border:1px solid #003559;}
.prod_panel_null{box-sizing:border-box;width:32%;padding:20px 10px;margin-bottom:10px;border:none;}
.prod_panel a:link,
.prod_panel a:visited{color:#333;}
.prod_panel a:hover{cursor:pointer;}

.prod_panel-box .contents_prod_picture{padding:0;}
.prod_panel-box .contents_prod_picture img{width:100%;margin-bottom: 10px;}
.prod_panel-box .contents_prod_lead{margin-bottom:20px;padding: 0 10px;}
.prod_panel-box .contents_prod_lead p{text-align:left;}
.prod_panel-box .contents_prod_spec{text-align:center;}

.prod_panel-box h1 {
    text-align: center;
    font-size: 1.4rem;
    font-weight: 600;
    border-bottom: 1px solid #000;
    margin-bottom: 20px;
}

.prod_panel-box h1 span{font-size: 1.0rem;}
.prod_panel-box h1,
.prod_panel-box h3{color:#003559;}

.prod_panel-box h3{margin-top:20px;}


/* --- COSME_SINGLE ---*/


.contents_chart img{width:100%;}
.contents_chart p{text-align:center;color: #003559;font-size:1.2rem;margin:20px auto;line-height:250%;}
.contents_chart p .contents_chart_text1,
.contents_chart p .contents_chart_text2{border-bottom:2px solid #003559;letter-spacing:2px;}
.contents_chart p .contents_chart_text2{font-size:1.8rem;}


.prod-text-201906 p{font-size:1.1rem;}
.prod-text-201906 h2{color: #003559;font-size:1.2rem;margin:20px 0 10px 0;}

.prod-text-201906 dt,
.prod-text-201906 dd{margin-bottom:3px;line-height: 1.5rem;}

.prod-text-201906 dt{color: #003559;font-size:1.1rem;font-weight:500;float:left;}
.prod-text-201906 dd{margin-left:6rem;}


/*
.contents_prod{display:flex;margin:50px auto 100px auto;}
.contents_prod_lead h1{text-align:center;font-size:1.4rem;font-weight:500;border-bottom:1px solid #000;margin-bottom:20px;}
.contents_prod_lead h1 span{font-size:1.0rem;}
.contents_prod_lead p{text-align:center;}

.contents_prod_picture{padding:0 50px;}
.contents_prod_picture img{width:300px;}

.contents_prod_spec h2{font-size:1.3rem;font-weight:500;}
.contents_prod_spec h2 span{font-size:0.9rem;}
.contents_prod_spec p.caution{font-size:0.8rem;}
.contents_prod_spec h3{font-size:1.3rem;font-weight:500;letter-spacing:2px;color: #003559;margin-top:20px;}






.contents_text h1,
.contents_text h2{font-weight: 400;color: #003559;}
.contents_text h1{
	font-size: 1.8rem;
	border-bottom: 1px dotted #333;
	margin-bottom:20px;
	padding-bottom:20px;
}
.contents_text h2{
	font-size: 1.6rem;
	border-top: 1px dotted #333;
	margin-top:20px;
	padding-top:20px;
}

.contents_text p{font-size: 1.2rem;line-height:180%;}

.contents_text p.caution{font-size:0.8rem;}


.contents_text_main_illust{float:right;margin-left:50px;}
.contents_text_main_illust img{width:300px;}

.contents_text ul{margin:20px 0;padding:0;list-style:none;display:flex;justify-content:space-between;}
.contents_text li{
	color: #fff;
	background-color: #003559;
	width: 30%;
	padding: 15px 1%;
	display: flex;
	align-items: center;
	font-size: 1.2rem;
	border-radius:5px;
}
.contents_text li span{display:block;text-align:center;width:100%;}

.contents_text .contents_text_sub {margin:30px auto;}
.contents_text .contents_text_sub p{font-size: 1rem;margin-bottom:0;}

.contents_text .contents_text_seibun{border-top:1px solid #000;padding-top:20px;display:flex;}
.contents_text .contents_text_seibun p.title{
	white-space: nowrap;
	margin-right: 20px;
	padding-right: 20px;
	border-right: 1px solid #000;
}
.contents_text .contents_text_seibun p{
	font-size: 0.8rem;
	line-height: 140%;
}

*/


.contents_picture{margin:50px auto;}
.contents_picture img{width:100%;}



.main_visual_cosme_single{margin:80px auto 40px auto;position:relative;}
.main_visual_cosme_single img{width:90%;margin:0 auto;display:block;}
.main_visual_cosme_single p{position:absolute;top:0;right:100px;}
.main_visual_cosme_single p img{width:100px;}

header.header_cosme_single{align-items:center;}
.footer{margin:50px auto;text-align:center;}
.footer img{width:180px;}

/*  --- THANKS ---*/
.page_thanks .contents{text-align:center;}


/* --- COMP --- */
.contents_comp{}
.contents_comp table{margin-bottom:60px;width:100%;}
.contents_comp th,
.contents_comp td{padding:10px;border-bottom:1px dotted #ccc;}
.contents_comp table ul{margin-left:1rem;padding-left:0;margin-top:0;margin-bottom:0;}
.contents_comp table iframe{margin-top:20px;}



/* --- FORM --- */
.contact_form{margin:20px auto;text-align:center;padding:40px;background-color:#f9f9f9;}
.contact_form form{display:inline-block;width:auto;}

.contact_form dt{margin-bottom:5px;}
.contact_form dd{margin-bottom:15px;}

.contact_form dt,
.contact_form dd{text-align:left;}

.contact_form dd input,
.contact_form dd textarea{width:200px;}

.contact_form dd input[type="email"]{width:600px;}

.contact_form dd textarea{width:600px;height:200px;}


input[type="text"],
input[type="tel"],
input[type="email"],
input[type="button"],
textarea{
    border:1px solid #ccc;
	font-size:1.2rem;
	padding:5px;
}


input[type="submit"],
input[type="button"]{
	transition-property: all;
	transition: 0.3s linear;
	font-size:1.2rem;
    padding: 10px 20px;
    border: 1px solid #999;
	background:#fff;
	margin-top:40px;
}

input[type="submit"]:hover,
input[type="button"]:hover{cursor:pointer;background:#003559;color:#fff;}



/* -- FORM 2---*/

.contact_form dd input#label_zip{width:100px;}
.contact_form dd input#label_add{width:600px;}


/* -- FORM CONFIRM---*/
.formTable{margin:50px auto 20px auto;}
.formTable th,
.formTable td{padding:5px 10px;border-bottom:1px dotted #ccc;}


/* --- 404 --- */
.page_404{text-align:center;}
.page_404 h1{font-size:4rem;color:#ccc;}
.page_404 h2{font-size:2rem;color:#003559;}
.page_404 .contents{padding:50px 0;}

.page_404 p{margin-top:20px;}



@media screen and (max-width:959px){
	
	br.br_sp{display:block;}
	br.br_pc{display:none;}
	
	
	header{width:94%;display:block;text-align:center;}
	header .header_title{margin-top:10px;padding-left:0;}
	.header_logo{width:100px;display:inline-block;}
	.header_nav{width:100%;}
	.header_nav ul{display:none;}
	
	.ham_menu{display:block;}
	.container{width:100%;}
	
	
	
	footer,
	footer.footer_index{width:auto;display:block;text-align:center;margin-right:0;}
	footer h1{margin-right:0;display:block;}
	footer p{display:block;}
	
	.ham_menu li{
	display: block;
	padding: 10px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #000;
	}
	.ham_menu li a{display:inline-block;text-decoration:none;}
	.ham_menu li a:link,
	.ham_menu li a:visited{color:#fff;}
	.ham_menu li a:hover{color:#FC6;}
	
	
	/* --- INDEX --- */
	.header_index{padding-top:20px;}
	.page_index{width:100%;margin-top:0;}
	.page_index .contents{margin-top:0;}
	body.body_index{padding:0;border-left:none;}
	.slick-slider{margin-left:16.6%;}
	.main_visual{margin-top:10px;}
	.main_visual img{width:100%;}
	p.icon_news{position:relative;display:block;left:0;text-align:center;padding:5px 0;width:66%;margin:0 auto 20px auto;}
	p.icon_news span{font-size:1.2rem;}
	

	.logo {
		position:static;
		width: 120px;
		margin:0 auto 20px auto;
		left: 0;
		right:0;
		top:0;
		z-index: 99;
	}
	
	.page_index{min-width:auto;}
	
	footer.footer_index{margin-top:60px;}
	
	.index-line h2{text-align:center;}
	.index-line-panel-gray{display:none;}
	.index-line-panel{display:flex;flex-wrap:wrap;width:80%;margin:0 auto;}
	.index-line-panel figure{width:48%;margin-bottom:20px;}
	.index-line-panel figcaption{background:#F3F3F3;}
	
	.index-line-over{margin-bottom:20px;}
	
	.index-media{display:block;}
	.media-blog {
		width: 90%;
		margin:0 auto;
		padding: 0 0 20px 0;
		border-bottom: 1px solid #003559;
		border-right: none;
	}
	.media-mas {
		width: 90%;
		padding-left: 0;
		margin:0 auto;
	}
	
	
	.index-insta {margin-bottom: 20px;margin: 0 auto 20px auto;width: 80%;}
	.index-insta-inner{margin-top: 10px;display: flex;flex-wrap: wrap;justify-content: space-around;}
	
	
	.index-insta-inner a{width:50%;}
	
	.index-insta a:last-child{display:inline-block;}
	
	/* --- COMP --- */
	.page_comp{width:94%;margin:0 auto;}
	.contents_comp table{width:100%;}
	.contents_comp th,
	.contents_comp td{display:block;text-align:center;border:none;padding-left:0;padding-right:0;}
	.contents_comp th{background:#f0f0f0;}
	.contents_comp td ul{text-align:left;}
	
	/* ---COSME ---*/
	.prod_panel{width:90%;margin:10px auto;}
	
	/* ---COSME SINGGLE ---*/
	.main_visual_cosme_single{margin:20px auto 20px auto}
	.main_visual_cosme_single p{width:10%;top:0;right:5%;}
	.main_visual_cosme_single p img{width:100%;}


	.contents_chart p{font-size:1.0rem;margin:20px auto;line-height:200%;}
	.contents_chart p .contents_chart_text1,
	.contents_chart p .contents_chart_text2{letter-spacing:0;}
	.contents_chart p .contents_chart_text2{font-size:1.4rem;}
	
	
	
	/*
	.contents_prod{display:block;width:94%;margin:10px auto;}
	.contents_prod_lead h1{font-size:1.2rem;}
	.contents_prod_lead h1 span{font-size:1.0rem;}
	.contents_prod_lead p{text-align:left;margin-bottom:40px;}
	
	.contents_prod_picture{padding:0;text-align:center;}
	.contents_prod_picture img{width:80%;}
	
	
	.contents_prod_spec{text-align:center;}
	.contents_prod_spec h3{margin-top:10px;}
	

	.contents_text{width:94%;margin:40px auto;}
	
	.contents_text h1{font-size: 1.2rem;text-align:left;}


	.contents_text_main_illust{float:none;margin:0 0 20px 0;text-align:center;}
	.contents_text_main_illust img{width:80%;}

	.contents_text p{font-size: 1.0rem;line-height:180%;}

	.contents_text h2{font-size: 1.2rem;}
	.contents_text p.caution{font-size:0.7rem;}

	.contents_text ul{display:block;}
	.contents_text li{width: 100%;padding: 15px 0;margin-bottom:10px;}

	.contents_text li span{display:block;text-align:center;width:100%;}

	.contents_text .contents_text_sub p{font-size: 1rem;margin-bottom:0;}

	.contents_text .contents_text_seibun{display:block;border:none;}
	
	
	.contents_text .contents_text_seibun p.title{
		white-space: normal;
		margin: 0 0 10px 0;
		padding: 5px 0;
		border: none;
		text-align:center;
		font-weight:500;
		background:#aaa;
		color:#fff;
	}
*/
	.contents_picture{width:94%;}
	.contents_picture img{width:100%;}

	.footer img{width:20%;}
	
	
	
	/* --- FORM --- */
	
	.contact_form dd input,
	.contact_form dd textarea,
	.contact_form dd input[type="email"]{width:92%;padding:5px 4%;}
	
	.contact_form dd textarea{height:5rem;}
	
	
	
	
	input[type="text"],
	input[type="tel"],
	input[type="email"],
	textarea{
		border:1px solid #ccc;
		font-size:1.2rem;
		padding:5px;
	}
	
	
	input[type="submit"] {
		transition-property: all;
		transition: 0.3s linear;
		font-size:1.2rem;
		padding: 10px 20px;
		border: 1px solid #999;
		background:#fff;
		margin-top:40px;
	}
	
	input[type="submit"]:hover {cursor:pointer;background:#003559;color:#fff;}
	
	
	.formTable th,
	.formTable td{display:block;border-bottom:none;}
	
	
	/* form2*/
	.contact_form dd input#label_zip,
	.contact_form dd input#label_add{width:92%;padding:5px 4%;}
}

