/*@charset "utf-8";*/

/* last-update: 20150302 */
/* last-update: 20180215 */

/* ------------------------------------
	contents.css: I N D E X
------------------------------------
- base css
	- btn_opacity
	- title_line
	- title_bar
	- title_line_bg

- contents css
	- contact
	- order
	- environment
	- sds

- guide css
	- index
	- local
	- global

- product css
	- index: main
	- details: material
------------------------------------ */



/* -----------------------------------------------------------------
	base css
----------------------------------------------------------------- */
#contents p.top span{
	font-size:14px;
}

#contents #order,
#contents #environment,
#contents #contact,
#contents #guide,
#contents #local,
#contents #global,
#contents #sds,
#contents #cad {
	margin:40px auto 50px auto;
	width:100%;
	max-width:950px;
	text-align:left;
	z-index:0;
}

#contents #read_text{
	margin:40px auto 0 auto;
	width:100%;
	max-width:1150px;
	text-align:left;
	z-index:0;
}

#contents #order h1,
#contents #environment h1,
#contents #contact h1,
#contents #guide h1,
#contents #local h1,
#contents #global h1,
#contents #sds h1,
#contents #cad h1,
#contents #order h2,
#contents #environment h3,
#contents #contact h2,
#contents #guide h2,
#contents #local h2,
#contents #global h2,
#contents #sds h2,
#contents #cad h2,
#contents #order h3,
#contents #environment h3,
#contents #contact h3,
#contents #guide h3,
#contents #local h3,
#contents #global h3,
#contents #sds h3,
#contents #cad h3{
	padding:0;
}

@media screen and (max-width: 640px) {
	#contents #order,
	#contents #environment,
	#contents #contact,
	#contents #guide,
	#contents #local,
	#contents #global,
	#contents #sds,
	#contents #cad,
	#contents #read_text{
		margin:30px auto 0 auto;
	    max-width:640px;
	    width:92%;
	}
	/* sp_index */
	#contents #contact,
	#contents #contact .index,
	#contents #contact .index h2,
	#contents #contact .nav ul,
	#contents #guide,
	#contents #guide .index,
	#contents #guide .index h2,
	#contents #guide .nav ul,
	#contents #local,
	#contents #local .index,
	#contents #local .index h2,
	#contents #local .nav ul,
	#contents #global,
	#contents #global .index,
	#contents #global .index h2,
	#contents #global .nav ul,
	#contents #sds,
	#contents #sds .index,
	#contents #sds .index h2,
	#contents #sds .nav ul,
	#contents #cad,
	#contents #cad .index,
	#contents #cad .index h2,
	#contents #cad .nav ul,{
		width:100%;
	    max-width:100%;
	}
	#contents #order .main,
	#contents #environment .main,
	#contents #contact .main,
	#contents #sds .main,
	#contents #cad .main{
		float:none;
		width:100%;
		margin:0 auto 50px;
	}
	#contents #guide .main,
	#contents #local .main,
	#contents #global .main{
		float:none;
		width:100%;
		margin:0 auto 50px;
		word-wrap:break-word;
	}
	#contents #contact .nav,
	#contents #guide .nav,
	#contents #local .nav,
	#contents #global .nav,
	#contents #sds .nav,
	#contents #cad .nav{
		float:none;
		width:100%;
		margin:0 auto 20px;
		text-align:left;
	}
	#contents #contact .nav ul,
	#contents #guide .nav ul,
	#contents #local .nav ul,
	#contents #global .nav ul,
	#contents #sds .nav ul,
	#contents #cad .nav ul{
		float:none;
		width:100%;
		margin:0 auto;
	}
	#contents #contact .nav .contact li,
	#contents #guide .nav .contact li,
	#contents #local .nav .contact li,
	#contents #global .nav .contact li,
	#contents #sds .nav .contact li,
	#contents #cad .nav .contact li,
	#contents #contact .nav .bnr,
	#contents #guide .nav .bnr,
	#contents #local .nav .bnr,
	#contents #global .nav .bnr,
	#contents #sds .nav .bnr,
	#contents #cad .nav .bnr{
		margin-bottom:20px;
	}
	#contents #contact .nav ul li img,
	#contents #guide .nav ul li img,
	#contents #local .nav ul li img,
	#contents #global .nav ul li img,
	#contents #sds .nav ul li img,
	#contents #cad .nav ul li img,
	#contents #contact .main img,
	#contents #guide .main img,
	#contents #sds .main img,
	#contents #product .main img {
		min-width: 100%;
	}
}


/* btn_opacity */
#contents .btn a:hover{
	opacity:0.8;
}


/* title_line */
#contents .ttlline,
#contents .ttlline.top{
	clear:both;
	width:100%;
	border-top:solid 3px #000000;
	background-image:url("/prdct/display/images/ttl_line.png");
	background-repeat:repeat-x;
	background-position:left bottom;
	margin:50px 0 20px 0;
}
#contents .ttlline.top{
	margin:0 0 20px 0;
}
#contents .ttlline span{
	display:block;
	padding:15px 0;
    color:#333333;
    font-size:21px;
    letter-spacing:1.3px;
}

/* title_bar */
#contents .ttlbar,
#contents .ttlbar.top{
	clear:both;
	background-color:#333333;
	margin:50px 0 20px 0;
	padding:7px 12px;
	color:#ffffff;
	font-size:16px;
	line-height:1.2;
	letter-spacing:1.3px;
}
#contents .ttlbar.top{
	margin:0 0 20px 0;
}



/* -----------------------------------------------------------------
	guide css
----------------------------------------------------------------- */
#contents #guide h1,
#contents #local h1,
#contents #global h1{
	padding-bottom:30px;
	font-size:30px;
	color:#333333;
	font-weight:normal;
}
#contents #guide h2{
	padding-bottom:30px;
	font-size: 16px;
	color:#333333;
	font-weight:normal;
}
#contents #guide .map{
	background-image:url("/prdct/display/images/guide/index/map.png");
	background-repeat:no-repeat;
	background-position:left top;
	width:950px;
	height:471px;
	position:relative;
}
#contents #guide .map .europe{
	position:absolute;
	top:69px;
	left:88px;
}
#contents #guide .map .japan{
	position:absolute;
	top:172px;
	left:423px;
}
#contents #guide .map .asiapacific{
	position:absolute;
	top:252px;
	left:312px;
}
#contents #guide .map .northamerica{
	position:absolute;
	top:89px;
	right:107px;
}


#contents #guide .map p a{
	text-decoration:none;
	border:solid 1px #cccccc;
	background-color:#fafafa;
	border-radius:3px;
	font-size:15px;
	letter-spacing:0.1em;
	color:#333333;
	padding:6px 29px 7px 20px;
	font-weight:bold;
}
#contents #guide .map p a:hover{
	text-decoration:none;
	background-color:#ebf4fc;
}
#contents #guide .map p.europe a,
#contents #guide .map p.japan a{
	background-image:url("/prdct/display/images/icon_arw.png");
	background-repeat:no-repeat;
	background-size:10%;
	background-position:87% 55%;
}
#contents #guide .map p.asiapacific a,
#contents #guide .map p.northamerica a{
	background-image:url("/prdct/display/images/icon_arw.png");
	background-repeat:no-repeat;
	background-size:6%;
	background-position:93% 55%;
}


/* read_text */
#contents #read_text p{
    margin-bottom:30px!important;
}

#contents #read_text .title{
    padding-bottom:30px!important;
}
#contents #read_text .title h2{
    float:left!important;
    color:#555555!important;
    font-size:20px!important;
    font-weight:bold!important;
}
#contents #read_text .title p{
    float:right!important;
	display:inline-block!important;
	background-image:url("/prdct/display/images/icon_arw.png")!important;
	background-repeat:no-repeat!important;
	background-size:25%!important;
	background-position:left center!important;
    padding-left:20px!important;
}
#contents #read_text .title p a,
#contents #read_text .title p a:hover{
	color:#333333!important;
	text-decoration:none!important;
}
#contents #read_text .title p a:hover{
	color:#2a96e1!important;
}

/* global */
#contents #global h3.ttlbar{
	margin:0 0 15px 0!important;
	padding:5px 0 5px 10px!important;
}
#contents #global h3.ttlbar:first-child{
	margin:20px 0 15px 0!important;
}

#contents #global div {
	/*background-image:url("/prdct/display/images/ttl_line.png")!important;
	background-repeat:repeat-x!important;
	background-position:left bottom!important;*/
	margin-bottom:0!important;
	/*padding-bottom:20px!important;*/
	font-size:14px!important;
	text-align:left!important;
}

#contents #global p {
	margin-bottom:30px!important;
}

#contents #global p span.address,
#contents #global p span.tel-link{
	display:inline;
}
#contents #global p em{
	font-weight:bold!important;
	font-style:normal!important;
}
#contents #global p a{
	color:#1780c4!important;
}
#contents #global p a{
    background-image:url("/prdct/display/images/icon_inlink.gif")!important;
    background-repeat:no-repeat!important;
    background-position:right top!important;
    padding-right:16px!important;
}

@media screen and (max-width: 640px) {
	/* index */
	#contents #guide .map{
		background-image:none!important;
		width:100%!important;
		height:auto!important;
		position:static!important;
		border-bottom:solid 1px #999999!important;
	}
	#contents #guide .map p a{
		display:block!important;
		text-decoration:none!important;
		background-color:#cccccc!important;
		box-shadow:none!important;
		border-top:solid 1px #999999!important;
		border-bottom:solid 1px #ffffff!important;
		border-radius:0!important;
		font-size:20px!important;
		letter-spacing:0.1em!important;
		padding:6px 0 5px 20px!important;
		background-image:none!important;
	}
	#contents #guide .map p a:hover{
		text-decoration:none!important;
		background-color:#ebf4fc!important;
	}
	#contents #guide .map .europe,
	#contents #guide .map .japan,
	#contents #guide .map .asiapacific,
	#contents #guide .map .northamerica{
		position:static!important;
	}
	#contents #guide .map p.europe a,
	#contents #guide .map p.japan a{
		background-image:url("/prdct/display/images/icon_arw.png")!important;
		background-repeat:no-repeat!important;
		background-size:4%!important;
		background-position:96% 51%!important;
	}
	#contents #guide .map p.asiapacific a,
	#contents #guide .map p.northamerica a{
		background-image:url("/prdct/display/images/icon_arw.png")!important;
		background-repeat:no-repeat!important;
		background-size:4%!important;
		background-position:96% 51%!important;
	}

	/* global */
	#contents #global .network{
		width:92%!important;
		margin:0 auto!important;
		word-break:normal!important;
	}
	#contents #global p{
		width:100%!important;
	}
	#contents #global p span,
	#contents #global p span.tel-link{
		display:inline!important;
	}
	#contents #global p span.address{
		display:block!important;
	}
}


/**/

#top_slideshow { background:#0092ce; margin:0 auto 30px auto!important; }
#top_slideshow .disp_pc,
#top_slideshow .disp_tab,
#top_slideshow .disp_tab2 {
	max-width: 100%;
	width: 1140px;
	height: 230px;
	background-image: url(../img/top/img_topmainview.jpg);
	background-repeat: no-repeat;
	background-position: right;
	margin: 0 auto;
}
#top_slideshow p {
	color: #fff;
	font-size: 24px;
	font-weight: bold;
	padding: 55px 30px;
	max-width: 650px;
	word-wrap: break-word!important;
}
#top_slideshow p span {
	font-size: 31px;
}


.disp_pc { display:block !important; }
.disp_tab { display:none !important; }
.disp_tab2 { display:none !important; }
.disp_sp { display:none !important; }

@media screen and (max-width: 1024px) {
.disp_pc { display:none !important; }
.disp_tab { display:block !important; }
.disp_tab2 { display:none !important; }
.disp_sp { display:none !important; }
#top_slideshow p { max-width: 520px; }
}

@media screen and (max-width: 850px) {
.disp_pc { display:none !important; }
.disp_tab { display:none !important; }
.disp_tab2 { display:block !important; }
.disp_sp { display:none !important; }
#top_slideshow p { max-width: 350px; }
}

@media screen and (max-width: 768px) {

	/* #top_slideshow */

	#top_slideshow p {
		font-size: 17px;
		padding: 3.12vw 4%;
		word-wrap:break-word!important;
	}
	#top_slideshow p span {
		font-size: 22px;
	}

.disp_sp { display:block !important; }
.disp_tab { display:none !important; }
.disp_tab2 { display:none !important; }
.disp_pc { display:none !important; }
}

.h2-basic { line-height:1.3; margin:0 0 20px !important; padding:12px 16px !important; font-size:1.125rem !important; color:#333; font-weight:bold !important; position:relative; }
.h2-basic:before { content:""; position:absolute; top:10px; left:0; width:3px; height:27px; border-left:3px #d60522 solid; }

.h3-basic { line-height:1.3; border-bottom:1px #d9d9d9 solid; margin:0 0 20px !important; padding:10px 0 !important; font-size:1.125rem !important; color:#333; font-weight:bold !important; }
.h4-basic { line-height:1.3; margin:0 0 15px !important; padding:8px 15px 10px 1.2rem !important; font-size:1rem !important; color:#333; font-weight:bold !important; position:relative; }
.h4-basic:before { content:""; position:absolute; top:8px; left:0; width:1rem; height:1rem; background:#e00523; }
.h5-basic { line-height:1.3; margin:0 0 15px !important; padding:5px 0 10px !important; font-size:1rem !important; color:#333; font-weight:bold !important; }


.notice {
	border: 1px solid #ccc;
	padding: 15px 20px !important;
	margin: 0 0 30px 0 !important;
}


@media screen and (max-width: 640px) {

.h2-basic { margin:0 0 3vw !important; padding:1.98vw 6% !important; font-size:4.68vw !important; }
.h2-basic:before { position:absolute; top:2.98vw; left:3%; height:4.68vw; }

.h3-basic { margin:0 0 3vw !important; padding:1.56vw 0 !important; font-size:4.68vw !important; }
.h4-basic { margin:0 0 2vw !important; padding:1.56vw 0 1.56vw 4.68vw !important; font-size:3.86vw !important; }
.h4-basic:before { position:absolute; top:1.98vw; left:0; width:3.86vw; height:3.86vw; }
.h5-basic { margin:0 0 3vw !important; padding:1.56vw 0 !important; font-size:3.86vw !important; }

.notice {
	border: 1px solid #ccc;
	padding: 5px 10px !important;
	margin: 0 0 20px 0 !important;
}
}