@charset "UTF-8";

/* ========== COMMON ========== */

html { font-size: 62.5%; }

body
{
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
color: #333333;
line-height: 1.75;
word-wrap: break-word;
}

/*a { color: #333333; text-decoration: none; }
a:visited { color: #333333; text-decoration: none; }
a:hover { color: #333333; text-decoration: underline; }*/

a, a:visited { color: #264993; text-decoration: underline; }
a:hover { color: #264993; text-decoration: none; }

/*Safariでヒラギノ角ゴシックをきれいに表示させるCSS*/
@font-face {
font-family: sans-serif;
src: local(HiraginoSans-W3);
font-weight: normal;
}
@font-face {
font-family: sans-serif;
src: local(HiraginoSans-W6);
font-weight: bold;
}
@font-face {
font-family: 'Hiragino Kaku Gothic Pro W3';
src: local(HiraginoSans-W3);
font-weight: normal;
}
@font-face {
font-family: 'Hiragino Kaku Gothic Pro W3';
src: local(HiraginoSans-W6);
font-weight: bold;
}
@font-face {
font-family: 'ヒラギノ角ゴ Pro W3';
src: local(HiraginoSans-W3);
font-weight: normal;
}
@font-face {
font-family: 'ヒラギノ角ゴ Pro W3';
src: local(HiraginoSans-W6);
font-weight: bold;
}
@font-face {
font-family: 'ヒラギノ角ゴ ProN W3';
src: local(HiraginoSans-W3);
font-weight: normal;
}
@font-face {
font-family: 'ヒラギノ角ゴ ProN W3';
src: local(HiraginoSans-W6);
font-weight: bold;
}
@font-face {
font-family: 'ＭＳ Ｐゴシック';
src: local(HiraginoSans-W3);
font-weight: normal;
}
@font-face {
font-family: 'ＭＳ Ｐゴシック';
src: local(HiraginoSans-W6);
font-weight: bold;
}
@font-face {
font-family: 'MS P Gothic';
src: local(HiraginoSans-W3);
font-weight: normal;
}
@font-face {
font-family: 'MS P Gothic';
src: local(HiraginoSans-W6);
font-weight: bold;
}
@font-face {
font-family: 'MS PGothic';
src: local(HiraginoSans-W3);
font-weight: normal;
}
@font-face {
font-family: 'MS PGothic';
src: local(HiraginoSans-W6);
font-weight: bold;
}

/* clearfix */
.clearfix:after {
display:block;
clear:both;
visibility:hidden;
height:0;
content:".";
}
.clearfix { display:inline-block; }
.clearfix { display:block; }
* html .clearfix { height:1%; }

br.clear-both, div.clear-both { clear:both; font: 1px/1px monospace; display: block; }

/* ========== CONTENTS ========== */
/* ----- COMMON ----- */

img { max-width: 100%;  height: auto; }

/* BORDER */
.inset {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

/* IMG LINK */
a img { background:none!important; }
a:hover img { opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; background:none!important; }

.inner, .anchor_inner { display: block; position: relative; }
.center { text-align: center; }
.strong { font-weight: bold; }

sup { font-size: 75.5%; vertical-align: top; position: relative; top: -0.2em; }
sub { font-size: 75.5%; vertical-align: bottom; position: relative; top: -0.2em; }

/* ========== HEADER ========== */
header .hd-wrapper { background: #f0f0f0; position: relative; }
header h1 a, header .logo a, header .contact ul a, header .recruit a { text-decoration: none; }

/* ========== FOOTER ========== */
.btn_pagetop {}
.btn_pagetop a { background: url(../images/btn_pagetop.png) no-repeat; display: block; text-indent: -9999px; width: 41px; height: 41px; position: fixed; bottom: 10px; right: 10px; z-index: 9999; }
/* ----- CONTACT ----- */
#bn_contact { background: #000000 url("../images/ft_bg_contact.png") no-repeat center; }
#bn_contact .img { text-align: center; margin-bottom: 20px; }
#bn_contact p { color: #ffffff; font-weight: bold; text-align: center; }
/* ----- SITEMAP ----- */
#ft_sitemap { color: #ffffff; background: #264993; }
#ft_sitemap a, #ft_sitemap a:visited { color: #ffffff; text-decoration: none; }
#ft_sitemap a:hover { text-decoration: underline; }
#ft_sitemap ul li a:before { content: "□ "; }
#ft_sitemap ul li li a:before { content: "・"; }
#ft_sitemap ul li li { padding-left: 1em; }
/* ----- FOOTER BANNER ----- */
#ft_sitemap ul.ft_banner li a:before { content: none; }


/* ----- COPYRIGHT ----- */
#copyright { color: #ffffff; background: #3c3c3c; }
#copyright .inner { position: relative; }

/* ========== ARTICLE ========== */
/* ----- COMMON ----- */
#default h2 { font-weight: bold; text-align: center; display: block; border-top: 3px solid #264993; border-bottom: 3px solid #264993; }
#default.ceramic h2, #default.glass h2, #default.composite h2 { border: none; }
#default .catch { font-weight: bold; }
#default .catch font { color: #f36e00; }
#default .cap { font-weight: bold; text-align: center;  }
/* PAGE NAVI 1 */
#pagenavi1 ul a { color: #264993; font-weight: bold; text-decoration: none; background: #d8d8d8; display: block; text-align: center; }
#pagenavi1 ul a:hover { color: #ffffff; background: #264993; }
/* PAGE NAVi 2 */
#pagenavi2 ul a { color: #264993; font-weight: bold; text-decoration: none; background: url("../../introduction/images/pagenavi.png") no-repeat bottom; display: block; text-align: center;  }
#pagenavi2 ul a:hover { background: url("../../introduction/images/pagenavi_hover.png") no-repeat bottom; }
/* HD */
#hd img { display: block; }
#hd .inner { position: relative; }
#hd .title { text-align: center; position: absolute; }
#hd .title h1, #hd .title h2 { font-weight: bold; }
#hd .title h1 { color: #ffffff; display: inline-block; }
#hd.normal .title { background-color: rgba(0,174,203,0.8); border: 3px solid #ffffff; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }
/* MOV */
.movie { text-align: center; }
.movie .mov { position: relative; width: 100%; padding-top: 56.25%; }
.movie .mov iframe { position: absolute; top: 0; right: 0; width: 100%; height: 100%; }
.movie h4 { color: #264993; font-weight: bold; background: #ffffff; display: inline-block; border: 3px solid #264993; position: relative; }
.movie h4 .img { position: absolute; }
.movie ul li p { font-weight: bold; }

.map { position: relative; width: 100%; padding-top: 35%; }
.map iframe { position: absolute; top: 0; right: 0; width: 100%; height: 100%; }

@media screen and (max-width:768px) {
	
	body { font-size: 1.4em; }
	.pc { display: none; }
	.inner { padding: 10px; }
	
	/* ========== HEADER ========== */
	#header { width: 100%; position: fixed; top: 0; left: 0; z-index: 99; }
	header .tagline { font-size: 1.1rem; margin-bottom: 3px; }
	header h1 a, header .logo a, header .contact ul a, header .recruit a { display: block; position: relative; z-index: 100; }
	header h1 a, header .logo a { /*width: calc(100% - 150px); height: auto;*/ width: 200px; /*display: block; position: relative; z-index: 100;*/ }
	header h1 img, header .logo img { max-width: 100%; display: block; }
	header .contact ul .tel, header .contact ul .form, header .recruit { position: absolute; top: 10px }
	header .contact ul .tel { right: 110px; }
	header .contact ul .form { right: 62px; }
	header .recruit { right: 130px; }
	header .contact ul a, header .recruit a { /*display: block;*/ text-indent: -9999px; width: 40px; height: 40px; margin: 0 2px; }
	header .contact ul .tel a { background: url("../images/hd_icn_tel.png") no-repeat center; background-size: contain; /*width: 32px; height: 32px; margin: 0 1.5px;*/ }
	header .contact ul .form a { background: url("../images/hd_icn_form2.png") no-repeat center; background-size: contain;  }
	header .recruit a { background: url("../images/hd_icn_recruit.png") no-repeat center; background-size: contain; }
	header .contact ul a:hover, header .recruit a:hover { opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }
	
	/* ----- ANCHOR ----- */
	.anchor { display: block; width: 100%; position: absolute; left: 0; z-index: -1; height: 50px; top: -50px; }
	.offMov, .onMov { display: block; width: 100%; position: absolute; left: 0; z-index: -1; }
	.offMov { height: 50px; top: -50px; }
	.onMov { height: 50px; top: -50px; }
	_:-ms-lang(x), .anchor { display: block; width: 100%; position: absolute; left: 0; z-index: -1; height: 50px; top: -50px; }
	
	/* ========== FOOTER ========== */
	/* ----- CONTACT ----- */
	#bn_contact { padding: 20px 0; }
	#bn_contact p { margin-bottom: 10px; }
	#bn_contact li { text-align: center; }
	#bn_contact li img { max-width: 60%; }
	/* ----- SITEMAP ----- */
	#ft_sitemap ul li { font-size: 1.2rem; line-height: 2; margin-bottom: 1em; }
	#ft_sitemap ul li li { margin-bottom: auto; }
	/* ----- FOOTER BANNER ----- */
	#ft_sitemap ul.ft_banner { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
	#ft_sitemap ul.ft_banner li { margin-right: 10px; }
	/* ----- COPYRIGHT ----- */
	#copyright .inner { text-align: center; padding: 20px 0; }
	#copyright .logo img { width: 180px; margin-bottom: 5px; }
	#copyright .address {  font-size: 1.1rem; margin-bottom: 10px; }
	#copyright .copy { font-size: 1.0rem; margin-top: 5px; }
	
	/* ========== ARTICLE ========== */
	/* ----- COMMON ----- */
	article { padding: 60px 0; }
	#default h2 { font-size: 1.8rem; padding: 5px 0; margin-bottom: 20px; }
	#default.img_right, #default.img_left { margin-bottom: 20px; }
	#default.img_right .txt p, #default.img_left .txt p { margin-bottom: 10px; }
	/* PATH */
	#path { font-size: 1.2rem; }
	/* PAGE NAVI 1 */
	#pagenavi1 ul a { padding: 5px 0; margin-bottom: 10px; position: relative; }
	#pagenavi1 ul a:after { color: #00aecb; content: "▼"; position: absolute; right: 20px; }
	/* PAGE NAVI 2 */
	#pagenavi2 ul a { padding: 0 0 20px; margin-bottom: 10px; position: relative; }
	/* HD */
	#hd .inner { padding: 0; }/* HD */
	#hd.normal .title h1 { font-size: 1.7rem; padding: 3px 10px; white-space: nowrap; }
	/* MOV */
	.movie h4 { font-size: 1.6rem; padding: 8px 30px; margin-bottom: 20px; }
	.movie h4 .img { width: 50px; height: auto; top: -20px; left: -20px; }
	
}

@media screen and (min-width:769px) {
	
	body { font-size: 1.8em; }
	.sp { display: none; }
	.inner { display: block; width: 1200px; margin: 0 auto; }
	
	.left { float: left; }
	.right { float: right; }
	
	/* ========== HEADER ========== */
	header .hd-wrapper { padding: 20px 0; }
	header .tagline { font-size: 1.3rem; margin-bottom: 25px; }
	header .recruit { position: absolute; top: 55px; right: 0; }
	header .recruit a { font-size: 1.7rem; font-weight: bold; background: url("../images/hd_icn_recruit.png") no-repeat left center; display: block; height: 25px; padding-left: 45px; }
	header .contact { background: #ffffff; width: 320px; height: 90px; position: absolute; top: 0; right: 140px; }
	header .contact p { color: #264993; font-size: 1.7rem; font-weight: bold; background: #d8d8d8; text-align: center; }
	header .contact ul { display: flex; position: relative; }
	header .contact ul .tel {  position: absolute; left: 15px; top: 6px; }
	header .contact ul .tel a, header .contact ul .tel span { color: #264993; font-family: Arial; font-size: 2.9rem; background: url("../images/hd_icn_tel.png") no-repeat; padding: 1px 0 0 28px; }
	header .contact ul .form { position: absolute; right: 6px; top: 6px; }
	header .contact ul .form a { background: url("../images/hd_icn_form1.png") no-repeat; display: block; text-indent: -9999px; width: 70px; height: 50px; }
	header .contact ul a:hover, header .recruit a:hover { text-decoration: none; opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }
	
	/* ========== GLOBAL MENU ========== */
	nav { width: 100%; position: relative; top: 0; left: 0; z-index: 100; }
	nav.is-fixed { position: fixed; }
	#gNav { background: #264993; }
	#gNav ul { position: relative; display: flex; }
	#gNav li { /*position: relative;*/ }
	#gNav li a { color: #ffffff; font-size: 1.7rem; text-decoration: none; position: relative; display: block; text-align: center; padding: 15px 30px; }
	#gNav li a:hover, #gNav li.current > a { color: #f36e00; text-decoration: none; }
	#gNav .sub-menu { background: #6788c4; width: 100%; padding: 20px; visibility: hidden; opacity: 0; z-index: 1; display: flex; position: absolute; top: 60px; left: 0; -webkit-transition: all .2s ease; transition: all .2s ease; }
	#gNav .sub-menu li:first-of-type { color: #ffffff; font-size: 1.9rem; font-weight: bold; padding: 13px 50px; border-right: 1px solid #ffffff; }
	#gNav .sub-menu a { color: #ffffff; font-size: 1.7rem; display: block; padding: 14px 30px; }
	#gNav #g6 .sub-menu a { padding: 14px 15px; }
	#gNav .sub-menu a:before { content: "・"; }
	#gNav .sub-menu a:after { color: #f36e00; content: " ＞"; }
	#gNav li:hover ul.sub-menu { top: 60px; visibility: visible; opacity: 1; z-index: 9999; }
	
	#gNav ul .fa-angle-down { display: none; }
	
	
	/* ----- ANCHOR ----- */
	.anchor { display: block; width: 100%; position: absolute; left: 0; z-index: -1; height: 150px; top: -150px; }
	.offMov, .onMov { display: block; width: 100%; position: absolute; left: 0; z-index: -1; }
	.offMov { height: 150px; top: -150px; }
	.onMov { height: 100px; top: -100px; }
	_:-ms-lang(x), .anchor { display: block; width: 100%; position: absolute; left: 0; z-index: -1; height: 100px; top: -100px; }

	/* ========== FOOTER ========== */
	/* ----- CONTACT ----- */
	#bn_contact { height: 470px; padding-top: 50px; }
	#bn_contact p { font-size: 2.6rem; margin-bottom: 20px; }
	#bn_contact ul { display: flex; justify-content: center; }
	#bn_contact ul li { margin: 0 45px; }
	/* ----- SITEMAP ----- */
	#ft_sitemap .ft_sitemap-wrapper { display: flex; padding: 45px 0 50px; }
	#ft_sitemap .ft_sitemap-wrapper > ul { width: calc(100%/6); }
	#ft_sitemap ul li { font-size: 1.4rem; line-height: 2.1; margin-bottom: 1em; }
	#ft_sitemap ul li li { margin-bottom: auto; }
	/* ----- FOOTER BANNER ----- */
	#ft_sitemap ul.ft_banner { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; padding-bottom: 30px; }
	#ft_sitemap ul.ft_banner li { margin: 0 17px; }
	/* ----- COPYRIGHT ----- */
	#copyright .inner { /*height: 26px;*/ padding: 22px 0; }
	#copyright .logo { margin-top: 5px; }
	#copyright .address, #copyright .copy, #copyright .iso { position: absolute; }
	#copyright .address { font-size: 1.5rem; bottom: 15px; left: 315px; }
	#copyright .iso { top: 8px; left: 655px; }
	#copyright .copy { font-size: 1.2rem; bottom: 15px; right: 0; }
	
	/* ========== ARTICLE ========== */
	/* ----- COMMON ----- */
	#default h2 { font-size: 3.4rem; width: 580px; padding: 15px 0; margin: 0 auto 50px; }
	#default.ceramic h2, #default.glass h2, #default.composite h2 { font-size: auto; width: auto; padding: auto; margin: auto; }
	#default .img_right, #default .img_left { position: relative; }
	#default .img_right .txt, #default .img_left .txt { width: 560px; }
	#default .img_right .txt p, #default .img_left .txt p { margin-bottom: 15px; }
	/* PATH */
	#path { font-size: 1.4rem; padding: 20px 0; }
	/* HD */
	#hd.normal { margin-bottom: 50px; }
	#hd.normal h1 { font-size: 3.0rem; padding: 19px 40px; }
	/* PAGE NAVI 1 */
	#pagenavi1 { margin-bottom: 50px; }
	#pagenavi1 ul { display: flex; justify-content: center; }
	#pagenavi1 ul a { font-size: 1.7rem; padding: 17.5px 10px; margin: 0 5px; min-width: 250px; }
	/* PAGE NAV2 2 */
	#pagenavi2 { margin-bottom: 50px; }
	#pagenavi2 ul { display: flex; justify-content: center; }
	#pagenavi2 ul a { font-size: 1.7rem; padding: 10px 10px 25px; margin: 0 5px; min-width: 250px; }
	/* MOV */
	.movie h4 { font-size: 3.0rem; padding: 13px 50px; margin-bottom: 50px; }
	.movie h4 .img { top: -20px; left: -20px; }
	.movie ul li p { font-size: 30px; }
	
}