@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

html, body { -webkit-overflow-scrolling: auto; }

body { width: 100%; height: 100%; position: absolute; padding: 0; margin: 0; background-color: white; color: white; text-align: center; font-size: 16px; line-height: 1.8em; font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif, "Lucida Grande", "Lucida Sans Unicode", "ＭＳ Ｐゴシック", Verdana; }

.clear:before, .clear:after { content: ""; display: table; clear: both; }

.section { width: 100%; height: 700px; position: relative; }

.liquid { width: 100%; height: 100%; background-size: cover; }

.button { transition: background-color 0.3s ease-out, opacity 0.3s ease-out; display: inline-block; border-radius: 3px; text-decoration: none; color: #ff5a00; padding: .5em 3em .5em 1em; font-size: 16px; line-height: 2em; background: white url("../images/arrow_link.png") no-repeat right 10px; background-size: 38px 100px; margin-top: 20px; text-align: left; }
.button.border { border: 1px solid #ffb993; }
.button:hover { background-color: #ff5a00; color: white; background-position: right -63px; }

.ie8 .button { background-image: url("../images/arrow_link@ie8.png"); }
.ie8 .liquid { -ms-behavior: url("/global/scripts/backgroundsize.min.htc"); }

/*
.ie8,
.ie9 { .clear:before, .clear:after { visibility: hidden; display: block; content: ""; clear: both; height: 0; }
}
*/
#global-menu { background: white; }
#global-menu ul { height: 57px; letter-spacing: -.3em; width: 1000px; margin: 0 auto; }
#global-menu ul li { transition: background-color 0.3s ease-out, opacity 0.3s ease-out; display: inline-block; width: 170px; height: 52px; border-bottom: 5px solid white; box-sizing: content-box; }
#global-menu ul li:hover { background-color: #f6f6f6; border-bottom: 5px solid #ffddcb; }
#global-menu ul li.logo, #global-menu ul li.logo:hover { background-color: transparent; border: none; margin-right: 147px; }

.global-menu-fixed #global-menu { top: 0; position: fixed; width: 100%; z-index: 1000; border-bottom: 1px solid #ddd; }
.global-menu-fixed#home #global-menu .logo { display: inline-block; }
.global-menu-fixed#home #hero { margin-bottom: 57px; }

#global-footer { background: #395fab; margin: 0; }
#global-footer .logo { padding: 35px 0 20px; display: block; }
#global-footer .links { width: 600px; margin: 0 auto; border-top: 1px solid #9aafdb; padding: 20px 0 40px; }
#global-footer .links ul { display: inline-block; vertical-align: top; text-align: left; }
#global-footer .links ul.row1 { width: 21%; }
#global-footer .links ul.row2 { width: 21%; }
#global-footer .links ul.row3 { width: 13%; }
#global-footer .links ul.row4 { width: 16%; }
#global-footer .links ul.row5 { width: 21%; }
#global-footer .links ul li.main { font-weight: bold; }
#global-footer .links ul li a { color: white; font-size: 12px; text-decoration: none; }
#global-footer .links ul li a:hover { text-decoration: underline; }
#global-footer .copyright { font-size: 12px; padding: 1em; }

#home #global-menu .home, #about #global-menu .about, #works #global-menu .works, #contact #global-menu .contact { border-bottom: 5px solid #ff5a00; }

/* 
-------------------------------------------------------------------
HOME 
-------------------------------------------------------------------  
*/
#home #global-menu .logo { display: none; }
#home h2 { border-bottom: 2px solid #ff5a00; padding-bottom: 15px; margin-bottom: 17px; }
#home #hero { height: 524px; }
#home #hero .carousel { width: 100%; height: 100%; }
#home #works .block { width: 33.333%; float: left; height: 350px; position: relative; overflow: hidden; }
#home #works .block a { transition: background-color 0.3s ease-out, opacity 0.3s ease-out; position: absolute; top: 0; display: block; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8); }
#home #works .block a i { display: block; background-size: 204px 102px; width: 204px; height: 51px; background-position: 50% 0; text-indent: -9999px; }
#home #works .block a:hover { background: rgba(255, 255, 255, 0); }
#home #works .block a:hover i { background-position: 50% bottom; }
#home #works .block#lead { background-color: white; }
#home #works .block#lead a { width: 90%; height: auto; text-decoration: none; color: #464646; }
#home #works .block#lead a .button { margin-top: 20px; }
#home #works .block#lead a:hover { opacity: 1; }
#home #works .block#lead a:hover .button { opacity: .8; }
#home #works .block.block01 a i { background-image: url("../../home/images/works_text01.png"); }
#home #works .block.block02 a i { background-image: url("../../home/images/works_text03.png"); }
#home #works .block.block03 a i { background-image: url("../../home/images/works_text04.png"); }
#home #works .block.block04 a i { background-image: url("../../home/images/works_text02.png"); }
#home #works .block.block05 a i { background-image: url("../../home/images/works_text05.png"); }
#home #history { height: 700px }
#home #history .front { width: 410px; padding: 50px; background-color: rgba(0,5,16,.7); position: absolute; top:50%; left:50%; margin: -240px 0 0 -255px; }
.ie8#home #history .front { background-color: #444; }
#home #history .front .col { display: inline-block; height: 100%; vertical-align: top; margin-top: 10px;  }
#home #history .front .col.right { margin-right: 0px; text-align: left; }
#home #history .front .col.right a { margin-top:0; }
#home #history .front p { color: white; text-align: left; }
#home #greeting .front { width: 466px; height: auto; }
#home #greeting .front p { color: white; text-align: center; }
#home #environment .front { width: 537px; height: 537px; text-align: center; background: url("../../home/images/greeting_circle.png") no-repeat 0 0; }
#home #environment .front .iso { margin: 40px auto 0px; }
#home #environment .front h2 { width: 420px; margin: 20px auto; }
#home #environment .front p { color: #464646; text-align: center; }
#home #news { text-align: left; width: 940px; margin: 0 auto; height: auto; }
#home #news h2 { margin: 20px 0 0; border: none; margin-top: 30px; }
#home #news .body { border-radius: 6px; box-sizing: border-box; background-color: #f6f6f6; width: 100%; margin: 0; padding: 60px 70px; }
#home #news .body ul li { font-size: 14px; border-bottom: 1px dotted #000; margin-bottom: 1em; padding-bottom: 1em; }
#home #news .body ul li:last-child { border: none; margin-bottom: 0; padding-bottom: 0; }
#home #news .body h3 { width: 15%; display: inline-block; color: #464646; vertical-align: top; }
#home #news .body p { width: 83%; display: inline-block; color: #464646; text-align: left; }
#home #news .body a { background-color: transparent; font-size: 14px; background-position: right 4px; background-size: 28px 74px; margin: 0; padding: 0 2.5em 0 0; }
#home #news .body a:hover { color: #ff0048; background-position: right 4px; text-decoration: underline; }
#home #news .go-news { float: right; margin: 0 0 30px 0; }
#home.ie8 #works .block a { background-color: #f1f1f1; }
#home.ie8 #works .block a:hover { background-color: transparent; }
#home.ie8 #works .block#lead a { background-color: white; }
#home.ie8 #works a i { width: 245px; height: 60px; }
#home.ie8 #works .block01 a i { background-image: url("../../home/images/works_text01@ie8.png"); }
#home.ie8 #works .block02 a i { background-image: url("../../home/images/works_text02@ie8.png"); }
#home.ie8 #works .block03 a i { background-image: url("../../home/images/works_text03@ie8.png"); }
#home.ie8 #works .block04 a i { background-image: url("../../home/images/works_text04@ie8.png"); }
#home.ie8 #works .block05 a i { background-image: url("../../home/images/works_text05@ie8.png"); }
#home.ie8 #news .body a { background-image: url("../images/arrow_link_small@ie8.png"); }

/* 
-------------------------------------------------------------------
NEWS 
-------------------------------------------------------------------  
*/
#news #news { text-align: left; width: 940px; margin: 57px auto 60px; height: auto; }
#news #news h2 { margin: 20px 0 0; border: none; margin-top: 30px; }
#news #news .body { border-radius: 6px; box-sizing: border-box; background-color: #f6f6f6; width: 100%; margin: 0; padding: 60px 70px; }
#news #news .body ul li { font-size: 14px; border-bottom: 1px dotted #000; margin-bottom: 1em; padding-bottom: 1em; }
#news #news .body ul li:last-child { border: none; margin-bottom: 0; padding-bottom: 0; }
#news #news .body h3 { width: 15%; display: inline-block; color: #464646; vertical-align: top; }
#news #news .body p { width: 83%; display: inline-block; color: #464646; text-align: left; }
#news #news .body a { background-color: transparent; font-size: 14px; background-position: right 4px; background-size: 28px 74px; margin: 0; padding: 0 2.5em 0 0; }
#news #news .body a:hover { color: #ff0048; background-position: right 4px; text-decoration: underline; }
#news.individual #body { margin: 57px auto 60px; width: 800px; text-align: left; }
#news.individual #body h3 { text-align: left; font-size: 16px; border-bottom: 2px solid #ff5a00; color: #464646; display: inline-block; margin: 30px 0 30px; }
#news.individual #body h2 { font-size: 18px; color: #464646; margin-bottom: 1em; }
#news.individual #body .text { color: #464646; margin-bottom: 1em; }
#news.individual #body .images { width: 100%; }
#news.individual #body .images .liquid { width: 49%; height: 250px; display: inline-block; }
#news.individual #body .sosumi { color: #464646; font-size: 10px; }
#news.ie8 #news .body a { background-image: url("../images/arrow_link_small@ie8.png"); }

/* 
-------------------------------------------------------------------
ABOUT 
-------------------------------------------------------------------  
*/
#about .bg { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
#about .front { max-width: 1000px; margin: 0 auto; height: 100%; position: relative; }
#about h3 { position: absolute; text-align: left; top: 30px; font-size: 16px; border-bottom: 2px solid #ff5a00; color: #464646; }
#about h3.static { position: static; display: inline-block; margin: 30px 0 30px; }
#about h4 { position: absolute; text-align: left; top: 60px; font-size: 14px; }
#about #rinen.section { margin-top: 57px; }
#about #rinen.section h3 { color: white; }
#about #rinen.section .text { position: relative; background: rgba(0, 0, 0, 0.3); width: 475px; height: 700px; margin: 0 auto; }
#about #greeting.section { height: auto; text-align: left; padding-bottom: 3em; }
#about #greeting.section .body { color: #464646; }
#about #greeting.section .body .left { width: 38%; float: left; }
#about #greeting.section .body .right { width: 62%; float: left; }
#about #greeting.section .body .right h2 { margin-bottom: 40px; }
#about #greeting.section .body .right .sign { float: right; margin-top: 40px; }
#about #outline.section, #about #history.section { height: auto; text-align: left; padding-bottom: 3em; }
#about #outline.section .right, #about #history.section .right { float: right; width: 32%; text-align: right; }
#about #outline.section table, #about #history.section table { width: 67%; color: #464646; font-size: 13px; }
#about #outline.section table tr, #about #history.section table tr { border-top: 1px solid #e6e6e6; border-left: 1px solid #e6e6e6; }
#about #outline.section table tr th, #about #history.section table tr th { background-color: #f4f4f4; width: 28%; font-weight: bold; }
#about #outline.section table tr th, #about #outline.section table tr td, #about #history.section table tr th, #about #history.section table tr td { vertical-align: top; border-bottom: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6; padding: .5em 1em; }
#about #outline.section table tr th.brn, #about #outline.section table tr td.brn, #about #history.section table tr th.brn, #about #history.section table tr td.brn { border-right: none; }
#about #outline.section table tr th span, #about #outline.section table tr td span, #about #history.section table tr th span, #about #history.section table tr td span { margin-right: 1.5em; word-break: nowrap; display: inline-block; }
#about #history.section table tr th { width: 15%; }
#about #history.section .body .right p { color: #464646; font-size: 12px; line-height: 1.3em; text-align: center; }
#about #quality.section { height: 1400px; }
#about #quality.section h3 { color: white; }
#about #quality.section .iso-logos { position: absolute; right: 0; top: 0; }
#about #quality.section .center.text { margin-top: 20px; }
#about #environment.section { height: 1000px; }
#about #environment.section h3, #about #environment.section h4 { color: #464646; }
#about #environment.section .iso-logos { position: absolute; right: 0; top: 0; }
#about #environment.section .center.text { margin-top: 20px; }

/* 
-------------------------------------------------------------------
WORKS 
-------------------------------------------------------------------  
*/
#works #categories { width: 1000px; margin: 0 auto; margin-top: 57px; letter-spacing: -.3em; }
#works #categories li { display: inline-block; width: 16.6%; letter-spacing: normal; }
#works #categories li a { transition: background-color 0.3s ease-out, opacity 0.3s ease-out; padding: 0.5em 0; display: block; text-decoration: none; color: #464646; font-size: 14px; }
#works #categories li a:hover { background-color: #527ACB; color: white; }
#works #categories li.active a { background-color: #003aaf; color: white; }
#works #items { background-color: #1E428B; }
#works #items .item { width: 33.333%; height: 350px; display: block; float: left; position: relative; }
#works #items .item .lazy { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; -ms-behavior: url("/global/scripts/backgroundsize.min.htc"); }
#works #items .item a { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; transition: background-color 0.3s ease-out, opacity 0.3s ease-out; opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; text-decoration: none; background-color: rgba(0, 0, 0, 0.6); position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#works #items .item a p, #works #items .item a i, #works #items .item a h3, #works #items .item a span, #works #items .item a div { margin: 0; }
#works #items .item a h3 { color: white; text-decoration: none; padding: 0 2em; font-size: 16px; }
#works #items .item a i { position: absolute; top: 2px; left: 2px; font-size: 12px; color: black; background-color: rgba(255, 255, 255, 0.8); padding: .5em 1em; }
#works #items .item a:hover { opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; }
#works.individual #body { margin-top: 57px; }
#works.individual #body .left { height: 100%; float: left; }
#works.individual #body .left #owl { width: 100%; height: 100%; }
#works.individual #body .left #owl .owl-controls { position: absolute; bottom: 0; width: 100%; }
#works.individual #body .left #owl .owl-controls .owl-page span { opacity: .8; background-color: white; }
#works.individual #body .left #owl .owl-controls .owl-page.active span { background-color: #00DAEC; }
#works.individual #body .right { height: 100%; float: right; box-sizing: border-box; }
#works.individual #body .right table { margin: 5% 5% 0 5%; border-top: 1px solid #003aaf; border-left: 1px solid #003aaf; color: #003aaf; width: 90%; box-sizing: border-box; }
#works.individual #body .right table th, #works.individual #body .right table td { border-bottom: 1px solid #003aaf; padding: 5px 25px; font-size: 16px; }
#works.individual #body .right table th { width: 35%; }
#works.individual #body .right table th.top { padding: 0; }
#works.individual #body .right table th.top h2 { width: 83%; font-size: 22px; padding: 25px; display: inline-block; box-sizing: border-box; vertical-align: top; }
#works.individual #body .right table th.top a { width: 15%; height: 40px; display: inline-block; box-sizing: border-box; text-indent: -9999px; border-left: 1px solid #003aaf; border-bottom: 1px solid #003aaf; float: right; vertical-align: top; background: url("../images/close.png") no-repeat 50% 50%; }
#works.individual #body .right table th.rr { border-right: 1px solid #003aaf; width: 100%; }
#works.individual #body .right table td { border-right: 1px solid #003aaf; padding-left: 0; }
#works.individual #body .right table.bottom { margin: 0% 5% 5% 5%; border-top: none; }
#works.individual #body .right table.bottom td { padding: 20px 25px !important; vertical-align: top; }
#works.individual .nav { background-color: #e9ecf3; }
#works.individual .nav a { display: block; padding: .5em 1em; width: 90px; color: #003aaf; text-decoration: none; }
#works.individual .nav a.prev { float: left; background: url("../images/arrow_left.png") no-repeat 0% 50%; margin-left: 2em; }
#works.individual .nav a.next { float: right; background: url("../images/arrow_right.png") no-repeat 100% 50%; margin-right: 2em; }

.ie8.individual#works, .ie9.individual#works { min-height: 100%; }

.ie8#works #items .item i { background-color: white; }

.ie8#works #items .item a { background: transparent url("/works/images/works_bg@ie8.png"); }

.ie8#works #items .item a h3, .ie8#works #items .item a i { -ms-filter: "alpha(opacity=0)"; }

.ie8#works #items .item a:hover h3, .ie8#works #items .item a:hover i { -ms-filter: "alpha(opacity=100)"; }

/* 
-------------------------------------------------------------------
CONTACT 
-------------------------------------------------------------------  
*/
#contact h3 { position: absolute; text-align: left; top: 30px; font-size: 16px; border-bottom: 2px solid #ff5a00; color: #464646; }
#contact h3.static { position: static; display: inline-block; margin: 30px 0 30px; }
#contact .front { max-width: 1000px; margin: 0 auto; height: 100%; position: relative; text-align: left; }
#contact #access.section { margin-top: 57px; padding-bottom: 20px; height: auto; color: #464646; }
#contact #access.section .left, #contact #access.section .right { display: inline-block; vertical-align: top; text-align: left; }
#contact #access.section .right { margin-left: 20px; font-size: 14px; }
#contact #access.section h4 { font-weight: bold; font-size: 16px; margin-bottom: .5em; }
#contact #access.section .map { width: 666px; height: 400px; margin-bottom: 30px; }
#contact #form.section { background-color: #eaeff4; height: auto; }
#contact #form.section form { text-align: center; padding-bottom: 5em; width: 500px; margin: 0 auto; }
#contact #form.section form p { color: #464646; margin-bottom: 2em; }
#contact #form.section form label { color: #464646; text-align: left; }
#contact #form.section form button { width: 130px; margin-top: 2em; background-image: none; }
#contact #form.section form button.btn-primary { background-color: #395fab; }
#contact.confirm #form.section { margin-top: 57px; color: #464646; min-height: 400px; }
#contact.confirm #form.section #formWrap { width: 500px; margin: 0 auto; }
#contact.confirm #form.section .error_messe { color: red; }
#contact.confirm #form.section table { width: 100%; color: #464646; font-size: 14px; margin: 2em 0; }
#contact.confirm #form.section table tr { border-top: 1px solid #e6e6e6; border-left: 1px solid #e6e6e6; }
#contact.confirm #form.section table tr th { background-color: #f4f4f4; width: 28%; font-weight: bold; }
#contact.confirm #form.section table tr th, #contact.confirm #form.section table tr td { vertical-align: top; border-bottom: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6; padding: .5em 1em; }
#contact.confirm #form.section table tr th.brn, #contact.confirm #form.section table tr td.brn { border-right: none; }
#contact.confirm #form.section table tr th span, #contact.confirm #form.section table tr td span { margin-right: 1.5em; word-break: nowrap; display: inline-block; }
#contact.confirm #form.section table tr td { background-color: white; }