/******************************************
container common
******************************************/

#container .etc_btn{
	text-align: center;
}

#container .etc_btn a{
	width:auto;
	padding:0.7em 3.5em 0.7em 1.7em;
	border:2px solid #00a8b8;
	border-radius: 10px;
	color:#00a8b8;
	font-size: 1.1rem;
	text-decoration: none;
	background:url(../images/common/icon_etc_btn.png) center right no-repeat;
	background-size: 1.3em;
	background-position : right 1.7em center;
	transition: 0.2s;
}

#container .etc_btn a:hover{
	background-color:#f5feff;
	border:2px solid #53daf9;
}

#container .etc_btn_list{
	padding:2em 0 0 0;
	list-style: none;
}
#container .etc_btn_list li{
	margin-bottom:3em;
}

@media screen and (min-width: 1025px) {

	#container .etc_btn_list{
		padding:2em;
		display: flex;
		justify-content: center;
	}
	#container .etc_btn_list li{
		margin-right:2.5em;
	}
	#container .etc_btn_list li:last-child{
		margin-right: 0;
	}
}

#container p a{
	color:#FFF;
}
#container p a:hover{
	color:#71eef4;
}

/******************************************
container
******************************************/

/*---procon1---*/

#container #procon1{
	width:90vw;
	max-width:1800px;
	margin:0 auto;
}
#container #procon1 .pro_copy1{
	margin-bottom:1em;
	color:#00a8b8;
	font-size:1.7rem;
	text-align: center;
	letter-spacing: 0.08em;
}
.sp #container #procon1 .pro_copy1{
	font-size:1.3rem;
}
#container #procon1 .pro_icon{
	display: flex;
	list-style: none;
	padding:0 0 2em 0;
}
.sp #container #procon1 .pro_icon{
	flex-wrap: wrap;
}
#container #procon1 .pro_icon li{
	margin-right: 3vw;
	font-size: 1.1rem;
	line-height: 1.4;
	text-align: center;
}
.sp #container #procon1 .pro_icon li{
	width:48%;
	margin-bottom:1em;
}
.sp #container #procon1 .pro_icon li:nth-child(2n){
	margin-right: 0;
}
#container #procon1 .pro_icon li:last-child{
	margin-right: 0;
}
#container #procon1 .pro_icon img{
	width:100%;
}
#container #procon1 .pro_icon p{
	padding-top:0.4em;
	color:#00a8b8;
}

#container #procon1 a{
	transition: 0.2s;
}
#container #procon1 a:hover{
	opacity: 0.8;
}

/*---pro_point---*/

#container div[id^='pro_point']{
	color:#FFF;
	width:100%;
	padding:3em 4vw;
	background-color: #00a8b8;
}
#container div[id^='pro_point'] .es_bg1{
	max-width:1200px;
	margin:0 auto;
	padding-top:2em;
}
#container div[id^='pro_point'] .es_bg2{
	max-width:1800px;
	margin:2em auto 5em auto;
}

#container .pro_potitle{
	text-align: center;
}

#container .pro_potitle .pro_icon2{
	width:17.8vw;
	margin:0 auto;
}
.sp #container .pro_potitle .pro_icon2{
	width:35vw;
}
#container .pro_potitle .pro_icon2 img{
	width:100%;
	max-width:356px;
}

#container .pro_potitle h3{
	font-size:2.5rem;
	font-weight: 400;
}

.sp #container .pro_potitle h3{
	font-size:1.4rem;
}

#container .pro_potitle .pro_pocopy{
	font-size:1.2rem;
}
.sp #container .pro_potitle .pro_pocopy{
	font-size:1rem;
}

#container .pro_inner h4{
	position: relative;
	font-size:1.5rem;
	font-weight:500;
	color:#00a8b8;
	padding:0.5em 1em;
	margin-bottom:1em;
	background-color:#FFF;
	}	
	
.sp #container .pro_inner h4{
	font-size:1.1rem;
}

#container .pro_inner .po1_copy{
	padding-bottom:40px;
	}	
		
.po1_point{
	padding:32px 4% 0 4%;
	border:3px solid #00abad;
	background-color:#fff;
	margin-bottom:25px;
	border-radius:1em;
	}
	.po1_point.noflame{
		border:none;
		background:none;
	}
	.po1_point.noflame img{
		width:30%;
		max-width:400px;
	}
	.sp .po1_point.noflame img{
		width:50%;
	}
.sp	.po1_point{
	margin-bottom:25px;
	}
.pol1_point_wrapper{display:none;}
.pol1_point_wrapper.open {display: block;}
.acToggle{
	text-align:center;
	color:#00abad;
	margin-bottom:5em;
}
.acToggle img{
	max-width:140px;
	cursor: pointer;
}
	
.po1_point p{
	font-size:1.3rem;
	padding-bottom:30px;
	color:#3b6780;
	}
	.sp .po1_point p{
		font-size:0.95rem;
		padding-bottom:0.5em;
	}
	.po1_point .imgtitle{
		display: block;
		width:90%;
		margin:0 auto;
		padding-bottom:0.8em;
		font-weight: bold;
		font-size: 1.2em;
		letter-spacing: normal;
	}
	.sp .po1_point .imgtitle{
		font-size: 1em;
	}
.point_img img{
	display: block;
	width:100%;
	margin:0 auto;
}

p .colorRed{
	font-weight: bold;
	color:#d94163;
	}	

.pro_table{
	width:100%;
	margin:0 auto;
	border-collapse: collapse;
	border-left:1px solid #ABC3C6;
	border-top:1px solid #ABC3C6;
	background-color:#FFF;
}
.pro_table th,
.pro_table td{
	display: block;
	border-right:1px solid #ABC3C6;
	color:#333;
}
.pro_table th{
	padding:1em 0.5em 0.5em 0.5em;
	width:100%;
	text-align: center;
}
.pro_table th img{
	display: block;
	width:auto;
	max-width:90%;
	margin:0 auto;
}
.pro_table td{
	padding:0 0 1em 0;
	border-bottom:1px solid #ABC3C6;
}
.pro_table .description{
	padding:0.5em 1em;
	margin-bottom:0.3em;
}
.pro_table .corp{
	padding:0.5em 1em;
	width:auto;
	font-size: 0.9em;
	color:#666;
}

/*--new product--*/

.new_product{
	position: relative;
	max-width: 1200px;
	background-color:#FFF;
	border-radius: 15px;
	padding:2.5em 1em 0 1em;
	margin:3em auto 3em auto;
}
.new_product h3{
	display: inline-block;
	position: absolute;
	top:-1.2em;
	left:0;
	right:0;

	width:17.5em;
	height:auto;
	padding:0.4em 1em;
	margin: 0 auto;
	
	font-size:1.1rem;
	font-weight:normal;
	text-align: center;
	color:#FFF;

	border-radius: 1.4em;
	background-color: #E84967;
}
.new_product.smile h3{
	width:22em;
	max-width: 98%;
	font-size:1rem;
	background-color: #FC9200;
}
i.icon-new-left,
i.icon-new-right,
i.icon-smile{
	position: relative;
	display: inline-block;
	width:1.3em;
	height:1.4em;
	margin:0 0.5em;
}
i.icon-new-left::after{
	content: '';
	position: absolute;
	left:0;
	top:0.3em;
	width:1.3em;
	height:1.4em;
	background: url('../images/product/icon-new-left.png') top left no-repeat;
	background-size: contain;
}
i.icon-new-right::after{
	content: '';
	position: absolute;
	left:0;
	top:0.3em;
	width:1.3em;
	height:1.4em;
	background: url('../images/product/icon-new-right.png') top right no-repeat;
	background-size: contain;
}
i.icon-smile::after{
	content: '';
	position: absolute;
	left:0;
	top:0.3em;
	width:1.3em;
	height:1.4em;
	background: url('../images/product/icon-smile.png') top right no-repeat;
	background-size: contain;
}

#container .new_product .pro_inner h4{
	color:#01A8B7;
	background-color:#EBF6F8;
}
#container .new_product i.labelicon::before{
	margin-left:0.7em;
	vertical-align:0.1em;
}
#container .new_product .pro_inner .po1_copy{
	padding-left:0.3em;
	color:#303839;
}

#container .new_product .marginBottom_xxl{
	margin-bottom:4em !important;
}

#container .new_product .po1_point{
	width:99%;
	margin-left:auto;
	margin-right:auto;
	border:2px solid #01A8B7;
}


@media screen and (min-width: 1025px) {

	.po1_point{
		padding:32px 45px 0px;
	}
	.pro_table{
		width:90%;
	}

	.pro_table th,
	.pro_table td{
		display: table-cell;
		border-right:1px solid #ABC3C6;
		border-bottom:1px solid #ABC3C6;
	}
	.pro_table th{
		padding:0.5em;
		width:300px;
	}
	.pro_table th img{
		width:250px;
	}
	.pro_table td{
		padding:0;
	}
	.pro_table .corp{
		background-color: #deefef;
	}

	/*--new product--*/

	.new_product{
		padding:3.5em 2em 0 2em;
		margin:7em auto 6em auto;
	}

	.new_product h3{
		width:18.8em;
		font-size:1.5rem;
	}
	.new_product.smile h3{
		width:23em;
		font-size:1.5rem;
	}
	
	.new_product .marginBottom_xxl{
		margin-bottom:5em !important;
	}
}

	
/* =========================================================
		con3
========================================================= */

.pro_inner .po1_copy2{
	padding-bottom:20px;
	}
.pro_inner .po1_pic{
	text-align:center;
	padding:30px 0 30px;
	}		
.pro_inner h4 span{
font-size:1rem;
font-weight:normal;
vertical-align:middle;
}
.sp .pro_inner h4 span{
	font-size:0.8rem;
}

.po_english{
	    border: 3px solid #00abad;
    background-color: #fff;
    width: 980px;
    margin: 0px auto 30px;
    padding: 37px 0 30px;

	}
	
.po_english .pctitle{
	background-color:#00abad;
	padding:1px 45px;
	display:inline-block;
	text-align:center;
	color:#fff;
	font-weight:bold;
	}
	
.pc_encon{
	background-color:#c5e5e4;
	padding:30px 35px;
	display:inline-block;
	border-radius:10px;
	position:absolute;
	top:95px;
	right:40px;
	}
	
	
.pc_encon .encopy1{
	color:#3b6780;
	font-weight:bold;
	padding-bottom:5px;
	}
	
.pc_encon .encopy2{
	font-weight:bold;
	}

.en_pic{
	text-align:center;
	
	}
	
/* =========================================================
		con4
========================================================= */
.typesystem {
	margin:10px 0 20px;
	}
.typesystem li{
	float:left;
	width:300px;
	margin-right:40px;
	}
	
.typesystem li:last-child{
	margin-right:0;
	}
	
.typesystem li img{
	width:100%;
	}
	
.typesystem .point1{
	color:#3b6780;
	font-size:23px;
	font-weight:bold;
	padding:10px 0 5px;
	
	}
	
/* =========================================================
		con5
========================================================= */
.pro_inner2{
    margin: 0 auto 40px;
	padding: 0 0 40px;
	}
.pro_inner2 h5{
	font-size: 1.3rem;
	font-weight:normal;
	border-bottom:2px #fff dotted;
	padding-bottom:5px;
	margin-bottom:10px;
	}
	.pro_inner2 h5 span{
		font-size:1rem;
	}
.pro_inner2 .etc_copy{
	padding-bottom:2em;
	line-height:1.8;
	-moz-osx-font-smoothing: grayscale;
	}
	
.pro_inner2 .etc_copy span{
	font-size:0.7rem;
	padding-left:1em;
	}
.pro_inner2 ul.etc_copy{
	padding-left:1.5em;
}
.pro_inner2 ul.etc_copy li{
	margin:0 0 0.7em 0;
	padding-left:0;
}
.pro_att{
	font-size:0.5rem !important;
	padding-top:2px;
}
.inputCont{
	position: relative;
	width: 980px;
	height:670px;
	margin-bottom:5em;
	margin:0 auto 5em auto;
	background:url(../images/product/input_base.png) top center no-repeat;
}
.tab .inputCont,
.sp .inputCont{
	width:100%;
}
.inputCont ul{
	list-style: none;
}
.inputCont li{
	position: absolute;
}
.inputCont li.case1{top:80px;left:163px;}
.inputCont li.case2{top:33px;left:402px;}
.inputCont li.case3{top:95px;left:684px;}
.inputCont li.case4{top:275px;left:83px;}
.inputCont li.case5{top:443px;left:191px;}
.inputCont li.case6{top:415px;left:415px;}
.inputCont li.case7{top:365px;left:689px;}

.inputCont li img{
	cursor: pointer;
	transition: all 300ms 0s ease;
}
.inputCont li img:hover{
	transform: scale(1.1);
}
.inputCont aside{
	display:none;
	display:block;
	position: absolute;
	left:0;
	right:0;
	top:210px;
	width:400px;
	margin:0 auto;
	padding:20px;
	font-size: 0.9rem;
	color:#FFF;
	border-radius: 10px;
	background-color:rgba(0,171,172,0.95);
	pointer-events:none;
	transition: all 500ms 0s ease;
	opacity:0;
}
.inputCont aside .case{
	display:none;
}
.inputCont aside h1{
	font-size:1.1rem;
	padding-bottom:0.3em;
	margin:0;
}
.inputCont aside h2{
	font-size:1rem;
	padding-bottom:0.3em;
	margin:0;
}
.inputCont aside .text{
	margin-bottom:1em;
}
.inputCont aside ul{
	padding:0;
	margin:0;
}
.inputCont aside ul li{
	position: relative;
	margin-left:1.5em;
	list-style-type: disc;
}

#pclog h5{
	font-size:1.2rem;
	font-weight:bold;
	color:#fff;
	margin-top:0;
	margin-bottom:0.3em;
}
#pclog ul{
	margin-bottom:2em;
	padding:0;
	margin:0 0 2em 0;
}
#pclog ul li{
	position: relative;
	margin-left:1.5em;
	list-style-type: disc;
}

/* =========================================================
		prolog
========================================================= */

.prolog {
	text-align:center;
	padding:32px 45px 0px;
	background-color:#fff;
	margin-bottom:25px;
	border-radius:1em;
}
.sp .prolog{
	padding:1.5em 1em;
}
.prolog h6{
	margin:0;
	padding:0 0 0.5rem 0;
	font-size:1.2rem;
	color:#00abad;
	text-align: left;
}
.prolog p{
	font-size:1.3rem;
	color:#3b6780;
	padding-bottom: 1em;
	text-align: left;
}
.sp .prolog p{
	font-size:1rem;
}
.prolog p.text{
	font-size:1rem;
	padding-bottom:1.5em;
	color:#3b6780;
	text-align: left;
	}
	.sp .prolog p.text{
		font-size:1rem;
		padding-bottom:1.5em;
	}
	.prolog p a,
	.prolog p a:visited{
		color:#3b6780 !important;
	}
.marginB30px{
    margin-bottom: 30px;
}

.marginB80px{
    margin-bottom: 80px;
}

.notice{
    font-size:0.8rem !important;
}

.fleximages{
	display: flex;
	justify-content: center;
	padding-bottom:3em;
}
.fleximages p{
	position: relative;
	width: 30%;
	margin-right:3%;
}
.fleximages a{
	position: relative;
	display: block;
}
.fleximages img{
	width: 100%;
	max-height:150px;
	object-fit: cover;
}

@media screen and (min-width: 1025px) {

	.fleximages p{
		width: auto;
	}
	.fleximages img{
		width: auto;
		max-height:150px;
	}
}

/* mobile
============================================================ */

.tab .inputCont,
.sp .inputCont{
    background:none;
    height:auto;
}
.tab .inputCont .img,
.sp .inputCont .img{
	display:none;
}
.tab .inputCont aside,
.sp .inputCont aside{
    display:block;
	position: relative;
	top:auto;
    width:80vw;
    height:auto;
	margin:0 auto 2em auto;
	padding:20px;
	color:#FFF;
	border-radius: 10px;
	background-color:#00A8B8;
	border:2px solid #FFF;
    pointer-events:none;
    opacity:1;
}
.tab .inputCont aside .case,
.sp .inputCont aside .case{
    display:block;
    text-align:center;
}
.tab .inputCont aside .case img,
.sp .inputCont aside .case img{
    width:150px;
    margin:0 auto 2em auto;
}
.tab .inputCont aside.note7,
.sp .inputCont aside.note7{
    display:none;
}
.tab .inputCont aside.note5,
.sp .inputCont aside.note5{
    display:none;
}


/* IE11
============================================================ */
 _:-ms-lang(x)::-ms-backdrop, #header .button a ,.submitBtn{
        padding-top: 1em;
	 padding-bottom:0.5em;
 }


/* clearfix
============================================================ */
.reset {
	clear:both;
	display:block;
	height:0px;
	font-size:1px;
	line-height:1px;
	min-height:1px;
	height:0;
	visibility:hidden;
}

.clearfix:after,
ul.details:after{
 content:".";
 display:block;
 clear:both;
 height:0;
 visibility:hidden;
}

.clearfix{display:inline-block;}

/* \*/
*html .clearfix{height:1%;}

.clearfix{display:block;}
/**/