@charset "utf-8";

@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}
@keyframes delayAnimeA{0%{opacity:0;transform:translateY(50px);}100%{opacity:1;transform:translateY(0);}}
@keyframes delayAnimeB{0%{opacity:0;transform:translateX(-100px);}100%{opacity:1;transform:translateX(0);}}

/* =Reset default browser CSS.
Based on work by Eric Meyer:http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
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,font,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;font-family:inherit;font-size:100%;font-style:inherit;font-weight:inherit;margin:0;outline:0;padding:0;vertical-align:baseline;}
:focus{outline:0;}
ol,ul{list-style:none;}
table{border-collapse:separate;border-spacing:0;}
caption,th,td{font-weight:normal;text-align:left;}
blockquote:before,blockquote:after,q:before,q:after{content:"";}
blockquote,q{quotes:"" "";}
img{max-width:100%;height:auto;vertical-align:bottom;-webkit-backface-visibility:hidden;}
a img{max-width:100%;height:auto;border:0;}
a:hover img{animation:fadeIn 1s ease 0s 1 normal;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
body{font:1rem/1.5 "ヒラギノ角ゴ Pro W3",Hiragino Kaku Gothic Pro," メイリオ",Meiryo,Osaka," ＭＳ Ｐゴシック",MS PGothic," sans-serif";color:#000;animation:fadeIn 2s ease 0s 1 normal;}

/* リンク設定
------------------------------------------------------------*/
a{text-decoration:none;outline:0;vertical-align:baseline;color:#6f614d;}
a:hover,a:active{color:#d4aa00;}

/**** Clearfix ****/
main #container,.inner:after{content:""; display:table;clear:both;}
main #container,.inner{zoom:1;}
.clearfix:before,.clearfix:after{content:" ";display:table;}
.clearfix:after{clear:both;}
.clearfix{*zoom:1;}

/* 汎用クラス
*****************************************************/
.pcDisp{display:block;}
.spDisp{display:none;}
.mb10{margin-bottom:10px;}
.mb20{margin-bottom:20px;}
img.alignLeft{float:left;margin:0 10px 10px 0;display:inline;}
img.alignRight{float:right;margin:0 0 10px 10px;display:inline;}
img.bd{border:#fff 5px solid;box-sizing:border-box;}
.alL{text-align:left;}
.cent{text-align:center;}
.alR{text-align:right;}
.fontL{font-size:1.5rem;}
.fontBold{font-weight:bold;}
.block{display:block;}
.delayAnime{animation-fill-mode:both;animation-duration:3s;animation-name:delayAnimeA;visibility:visible !important;}

/* ヘッダー
------------------------------------------------------------*/
header{background:#fff;}
header .inner{max-width:1200px;width:100%;margin:0 auto;padding:15px 0;box-sizing:border-box;}
header .inner #logo{animation-fill-mode:both;animation-delay:1s;animation-duration:1s;animation-name:delayAnimeA;visibility:visible !important;float:left;}
header .inner #logo span{margin-left:10px;font-size:1.2rem;font-weight:bold;color:#b69830;}
header .inner #logo a span{color:#b69830;}
header .inner #logo a:hover span{color:#b3b3b3;}
header .inner #inq{text-align:right;animation-fill-mode:both;animation-delay:1.3s;animation-duration:1s;animation-name:delayAnimeA;visibility:visible !important;float:right;}
header .inner #inq p a{color:#4d4d4d;}
header .inner #inq p a:hover{color:#b69830;}
header .inner #inq p::before{content:url(images/arrow.png);margin-right:10px;display:inline-block;vertical-align:middle;}
header .inner #inq dl{color:#b69830;display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;}
header .inner #inq dt{margin-right:20px;padding:5px 20px;font-size:.9rem;border:#b69830 1px solid;border-radius:100px;}
header .inner #inq dd{font-size:1.6rem;font-weight:bold;}
header .inner #inq dd::before{content:url(images/icn-tel.png);margin-right:10px;display:inline-block;line-height:1;vertical-align:middle;}

/* メイン画像
*****************************************************/
#kv{background:url(images/kv-bg.jpg) no-repeat center center / cover;animation:fadeIn 2s ease 0s 1 normal;}
#kv .inner{max-width:1200px;width:100%;margin:0 auto;padding:260px 0 50px;box-sizing:border-box;}
#kv .inner h1{margin:0 auto 240px;font-size:2rem;font-weight:bold;color:#333;text-align:center;text-shadow:white 2px 0 2px,white -2px 0 2px,white 0 -2px 2px,white -2px 0 2px,white 2px 2px 2px,white -2px 2px 2px,white 2px -2px 2px,white -2px -2px 2px;animation-fill-mode:both;animation-delay:1.9s;animation-duration:1s;animation-name:delayAnimeA;visibility:visible !important;}
#kv .inner .slider li{min-height:110px;margin:0 5px;padding:20px;background:#fff;border-radius:10px;}
#kv .inner .slider li dl{text-align:center;}
#kv .inner .slider li dt{margin:0 auto 10px;}
#kv .inner .slider li dt img{margin:0 auto;}

#companyTitle{padding:50px 0;background:url(images/company-bg.jpg) no-repeat center center / cover;text-align:center;animation:fadeIn 2s ease 0s 1 normal;z-index:10;}
#companyTitle h1{margin:0 auto 50px;padding:50px 20px;background:#fff;border:#ccc 1px solid;box-shadow:#999 3px 3px 10px;font-size:2rem;line-height:1.3;font-weight:bold;display:inline-block;}
#companyTitle h1 span{font-size:.8rem;font-weight:normal;display:block;}
#companyTitle .inner{max-width:800px;width:100%;margin:0 auto;padding:20px;background:rgba(0,0,0,0.8);display:block;border-radius:10px;box-sizing:border-box;}
#companyTitle .inner dl{color:#fff;}
#companyTitle .inner dt{margin:0 auto 10px;font-size:1.2rem;font-weight:bold;}
#companyTitle .inner dd{text-align:left;}

#businessTitle{padding:50px 0;background:url(images/business-bg.jpg) no-repeat center center / cover;text-align:center;animation:fadeIn 2s ease 0s 1 normal;z-index:10;}
#businessTitle h1{margin:0 auto 50px;padding:50px 20px;background:#fff;border:#ccc 1px solid;box-shadow:#999 3px 3px 10px;font-size:2rem;line-height:1.3;font-weight:bold;display:inline-block;}
#businessTitle h1 span{font-size:.8rem;font-weight:normal;display:block;}
#businessTitle .inner{max-width:800px;width:100%;margin:0 auto;padding:20px;background:rgba(65,89,138,0.8);display:block;border-radius:10px;box-sizing:border-box;}
#businessTitle .inner p{margin:0 auto 10px;font-size:1.2rem;font-weight:bold;color:#fff;text-align:center;}
#businessTitle .inner #projectBox{display:flex;flex-wrap:nowrap;justify-content:space-between;}
#businessTitle .inner #projectBox dl{width:48.5%;}
#businessTitle .inner #projectBox dt{margin:0 auto 20px;padding:10px;background:#fff;border-radius:5px;font-size:1.2rem;font-weight:bold;color:#41598a;text-align:center;display:block;}
#businessTitle .inner #projectBox dd{text-align:left;display:table;}
#businessTitle .inner #projectBox dd li{margin:0 auto 10px;padding:5px 0 5px 60px;font-size:.85rem;color:#fff;text-align:left;}
#businessTitle .inner #projectBox dd li p{font-size:1.2rem;line-height:1;text-align:left;}
#businessTitle .inner #projectBox dl:nth-child(1) dd li:nth-child(1){background:url(images/business-icn01.png) no-repeat left top;}
#businessTitle .inner #projectBox dl:nth-child(1) dd li:nth-child(2){background:url(images/business-icn02.png) no-repeat left top;}
#businessTitle .inner #projectBox dl:nth-child(1) dd li:nth-child(3){background:url(images/business-icn03.png) no-repeat left top;}
#businessTitle .inner #projectBox dl:nth-child(1) dd li:nth-child(4){background:url(images/business-icn04.png) no-repeat left top;}
#businessTitle .inner #projectBox dl:nth-child(2) dd li:nth-child(1){background:url(images/business-icn05.png) no-repeat left top;}
#businessTitle .inner #projectBox dl:nth-child(2) dd li:nth-child(2){background:url(images/business-icn06.png) no-repeat left top;}
#businessTitle .inner #projectBox dl:nth-child(2) dd li:nth-child(3){background:url(images/business-icn07.png) no-repeat left top;}
#businessTitle .inner #projectBox dl:nth-child(2) dd li:nth-child(4){background:url(images/business-icn08.png) no-repeat left top;}

#recruitTitle{padding:50px 0;background:url(images/recruit-bg.jpg) no-repeat center center / cover;text-align:center;animation:fadeIn 2s ease 0s 1 normal;z-index:10;}
#recruitTitle h1{margin:0 auto;padding:50px 20px;background:#fff;border:#ccc 1px solid;box-shadow:#999 3px 3px 10px;font-size:2rem;line-height:1.3;font-weight:bold;display:inline-block;}
#recruitTitle h1 span{font-size:.8rem;font-weight:normal;display:block;}

#contactTitle{padding:50px 0;background:url(images/contact-bg.jpg) no-repeat center center / cover;text-align:center;animation:fadeIn 2s ease 0s 1 normal;z-index:10;}
#contactTitle h1{margin:0 auto;padding:50px 20px;background:#fff;border:#ccc 1px solid;box-shadow:#999 3px 3px 10px;font-size:2rem;line-height:1.3;font-weight:bold;display:inline-block;}
#contactTitle h1 span{font-size:.8rem;font-weight:normal;display:block;}

#privacyTitle{padding:50px 0;background:url(images/contact-bg.jpg) no-repeat center center / cover;text-align:center;animation:fadeIn 2s ease 0s 1 normal;z-index:10;}
#privacyTitle h1{margin:0 auto;padding:50px 20px;background:#fff;border:#ccc 1px solid;box-shadow:#999 3px 3px 10px;font-size:2rem;line-height:1.3;font-weight:bold;display:inline-block;}
#privacyTitle h1 span{font-size:.8rem;font-weight:normal;display:block;}

/* 見出し
*****************************************************/
h2{margin:0 auto 50px;font-size:2rem;font-weight:bolder;line-height:1;position:relative;display:inline-block;}
h2:before{width:70px;height:4px;content:'';position:absolute;left:50%;bottom:-15px;display:inline-block;transform:translateX(-50%);background-color:#b69830;border-radius:1px;}

/* コンテンツ
*****************************************************/
main{padding:50px 0;background:url(images/main-bg-left.png) no-repeat left top,url(images/main-bg-right.png) no-repeat right top;display:block;box-sizing:border-box;}
main #top{display:block;}
main #top .inner{max-width:1200px;width:100%;margin:0 auto;padding:0;text-align:center;box-sizing:border-box;}
main #top .inner h1{margin:0 auto 20px;}
main #top .inner dl{max-width:800px;width:100%;margin:0 auto;padding:0;font-size:1.2rem;text-shadow:white 2px 0 2px,white -2px 0 2px,white 0 -2px 2px,white -2px 0 2px,white 2px 2px 2px,white -2px 2px 2px,white 2px -2px 2px,white -2px -2px 2px;box-sizing:border-box;}
main #top .inner dt{margin:0 auto 20px;font-weight:bolder;}
main #top .inner dd{text-align:left;}

main #introduction{margin:0 auto 50px;text-align:center;}
main #introduction .inner{max-width:800px;width:100%;margin:0 auto;padding:20px;display:block;box-sizing:border-box;}
main #introduction .inner dl{margin:0 auto 10px;padding-bottom:10px;border-bottom:#999 2px dotted;display:flex;flex-wrap:nowrap;justify-content:flex-start;}
main #introduction .inner dt{width:150px;font-weight:bold;text-align:left;}
main #introduction .inner dd{text-align:left;}
main #introduction .inner dd span{margin-left:10px;}

main #access{margin:0 auto 50px;text-align:center;}
main #access .inner{max-width:1200px;width:100%;margin:0 auto;padding:20px;display:block;box-sizing:border-box;}
main #access .inner iframe{width:100%;height:500px;border:#fff 5px solid;box-sizing:border-box;}

main #group{margin:0 auto 50px;text-align:center;}
main #group .inner{max-width:800px;width:100%;margin:0 auto;padding:20px;display:block;box-sizing:border-box;}
main #group .inner dl{margin:0 auto 10px;padding-bottom:10px;border-bottom:#999 2px dotted;display:flex;flex-wrap:nowrap;justify-content:flex-start;}
main #group .inner dt{width:150px;font-weight:bold;text-align:left;}
main #group .inner dd{text-align:left;}

main #engineer{margin:0 auto 50px;text-align:center;}
main #engineer .inner{max-width:800px;width:100%;margin:0 auto;padding:20px;display:block;box-sizing:border-box;}
main #engineer .inner dl{margin:0 auto 10px;padding-bottom:10px;border-bottom:#999 2px dotted;display:flex;flex-wrap:nowrap;justify-content:center;}
main #engineer .inner dt{margin-right:10px;}

main .common{margin:0 auto 50px;text-align:center;}
main .common .inner{max-width:800px;width:100%;margin:0 auto;padding:20px;display:block;box-sizing:border-box;}

/* 共通エリア
*****************************************************/
#bottomNav{padding:25px 0;background:#fff;text-align:center;box-shadow:#aaa -2px -2px 10px;box-sizing:border-box;}
#bottomNav ul{display:flex;flex-wrap:wrap;justify-content:center;}
#bottomNav li a{padding:0 20px;color:#000;display:block;}
#bottomNav li a:hover{color:#534741;animation:fadeIn 1s ease 0s 1 normal;}

/* フッター
*****************************************************/
footer{padding:50px 0;background:url(images/footer-bg.png) repeat left top,url(images/main-bg-left.png) no-repeat left top,url(images/main-bg-right.png) no-repeat right top;box-sizing:border-box;}
footer .inner{max-width:1200px;width:100%;margin:0 auto;color:#fff;text-align:center;box-sizing:border-box;}
footer .inner #footerLogo{margin:0 auto 10px;}
footer .inner #footerLogo span{margin-left:10px;font-size:1.2rem;font-weight:bold;}
footer .inner #footerLogo a span{color:#fff;}
footer .inner #footerLogo a:hover span{color:#b69830;}
footer .inner #footerTel{margin:0 auto 10px;font-size:2rem;font-weight:bold;color:#b69830;}
footer .inner #footerTel::before{content:url(images/icn-tel.png);margin-right:10px;display:inline-block;line-height:1;vertical-align:middle;}
footer .inner #spFooterTel{display:none;}
footer .inner #address{margin:0 auto 50px;}
address{color:#fff;text-align:center;word-break:break-all;}

/* グローバルナビゲーション
*****************************************************/
nav#mainNav{background:#b69830;animation-fill-mode:both;animation-delay:1.6s;animation-duration:1s;animation-name:delayAnimeA;visibility:visible !important;}
nav#mainNav ul{max-width:1200px;width:100%;margin:0 auto;display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;}
nav#mainNav li{width:100%;border-left:#fff 1px solid;text-align:center;box-sizing:border-box;position:relative;}
nav#mainNav li:last-child{border-right:#fff 1px solid;}
nav#mainNav li a{margin:0 auto;padding:20px 0;font-size:1.2rem;font-weight:bold;color:#fff;display:block;}
nav#mainNav li a span{font-size:.8rem;font-weight:normal;display:block;}
nav#mainNav li.active a{background:#fff;color:#b69830;}
nav#mainNav li a:hover{background:#b5b5b5;color:#fff;animation:fadeIn 1s ease 0s 1 normal;}
div.drawer,div.fixedMenu,.spMenuCenter{display:none;}

/* サイズ調整
------------------------------------------------------------*/
@media only screen and (max-width:1200px){
header .inner{padding:15px;}
}

/* タブレットサイズ
------------------------------------------------------------*/
@media only screen and (max-width:999px){
header .inner{padding:10px;}
header .inner #logo span{margin-left:0;font-size:1rem;display:block;}
header .inner #inq{margin-top:8px;}
nav#mainNav li a{padding:10px 0;}
#kv .inner{padding:300px 0 50px;}
#companyTitle,#businessTitle,#recruitTitle,#contactTitle,#privacyTitle{padding:50px 20px;}
main{padding:20px 0;background:url(images/sp-bg.png) repeat left top,url(images/main-bg-left.png) no-repeat left top,url(images/main-bg-right.png) no-repeat right top;}
main #top .inner,main #introduction .inner,main #access .inner,main #group .inner,main #engineer .inner,main .common .inner{padding:0 20px;}
.slick-prev{left:-30px !important;z-index:10;}
.slick-next{right:-30px !important;z-index:10;}
}

/* スマホサイズ
------------------------------------------------------------*/
@media only screen and (max-width:644px){
.pcDisp{display:none;}
.spDisp{display:block;}
.spBlock{display:block;}
img.alignRight,img.alignLeft{display:block;margin:0 auto 10px;float:none;}
header{padding:0;}
header .inner{display:none;}
.fixedMenu{width:100%;height:85px;padding:7px 0 0 7px;background:#fff;display:block !important;position:fixed;top:0;left:0;box-sizing:border-box;z-index:100;}
.fixedMenu .spMenuCenter{display:block;}
.fixedMenu .spMenuCenter img{width:auto;height:70px !important;}
#kv,#companyTitle,#businessTitle,#recruitTitle,#contactTitle,#privacyTitle{margin-top:85px;}
#companyTitle,#businessTitle,#recruitTitle,#contactTitle,#privacyTitle{padding:20px;}
#companyTitle h1,#businessTitle h1{margin:0 auto 20px;padding:20px;font-size:1.5rem;}
#recruitTitle h1,#contactTitle h1,#privacyTitle h1{margin:0 auto;padding:20px;font-size:1.5rem;}
#businessTitle .inner #projectBox{flex-wrap:wrap;}
#businessTitle .inner #projectBox dl{width:100%;}
div.drawer{display:block;}
#kv .inner{padding:40px 10px;}
#kv .inner h1{margin:40px auto;font-size:1.4rem;}
h2{margin:0 auto 30px;font-size:1.5rem;}
nav#mainNav{display:none;}
main #introduction .inner dl,main #group .inner dl{flex-wrap:wrap;}
main #introduction .inner dt,main #group .inner dt{width:100%;display:block;}
main #introduction,main #access,main #group,main #engineer,main .common{margin:0 auto 20px;}
#bottomNav{padding:20px 0;}
#bottomNav li a{padding:0 10px;}
footer{padding:20px;}
footer .inner #footerLogo span{margin:10px 0 0;display:block;}
footer .inner #footerTel{display:none;}
footer .inner #spFooterTel{margin:0 auto 10px;font-size:1.6rem;display:block;}
footer .inner #spFooterTel a{color:#b69830;}
footer .inner #spFooterTel::before{content:url(images/icn-tel.png);margin-right:10px;display:inline-block;line-height:1;vertical-align:middle;}
footer .inner #address{margin:0 auto 20px;}
.slick-prev{left:-0px !important;}
.slick-next{right:-0px !important;}
.spTel a{background:#fff !important;padding:0;font-size:1.7rem;font-weight:bold;color:#b69830 !important;text-align:center;display:block !important;}
.spTel a::before{content:url(images/icn-tel.png);margin-right:10px;display:inline-block;line-height:1;vertical-align:middle;}
}