body{margin:0; padding:0;font-size: 16px;font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Arial", "Yu Gothic", "Meiryo", sans-serif; }
p{text-align:justify;line-height:1.8em}
html, div{margin:0;padding:0}
.mobile{display: none;}
:root {
  --yellow: #fabe00;
  --blue: #003196;
  --red: #d42525
  }

@media screen and (max-width:800px) {
	body{font-size: 4vw;padding-top:21.5vw }
	.mobile{display: inline;}
}

#topHeader {border-bottom:12px solid #003196; position:relative;height:8em;background:#fff}
#topHeader h1 {margin:0;position: absolute;top:0.7em;left:2em;width:5em}
#topHeader img{width: 100%;height:auto} 

#headerRight{position:absolute;top:1.8em;right:2em;}
#headerRight .tel{font-size:3em;margin:0;line-height:1em;text-align: right;font-weight: bold;} 
#headerRight .tel span{font-size: 0.6em;font-weight: normal;}
#headerRight .links{text-align: right;margin:0;line-height:1.6em;color: #d1def8}
#headerRight .links a{text-decoration:none;color:var(--blue)}

/* ハンバーガーボタン */
#menu-btn-check {display: none;}/* チェックボックスを非表示 */
.menu-btn { width: 12vw; height: 12vw;  position:absolute; z-index: 10;  cursor: pointer;display: none;top:4.5vw;right:4vw}
.menu-btn span { display: block; height: 2vw;border-radius: 1vw; width: 100%; background-color: #aaa; position: absolute; left: 0; top: 50%; transform: translateY(-50%); transition: all .4s; }
.menu-btn span::before, .menu-btn span::after {content: "";display: block;height: 2vw;border-radius: 1vw;  width: 100%;  background-color: #aaa; position: absolute;  left: 0;transition: all .4s; }
.menu-btn span::before {top: -4vw;}
.menu-btn span::after {top: 4vw;}
/* メニューオープン時のアニメーション */
.menu-btn.is-open {position: fixed; }
.menu-btn.is-open span {background-color: rgba(255, 255, 255, 0);}
.menu-btn.is-open span::before {top: 0;transform: rotate(45deg);}
.menu-btn.is-open span::after {top: 0; transform: rotate(-45deg);}
/* メニューコンテンツのスタイル */
.menu-content { width: 100%; height: 100vh; position: fixed;  top: 0;  left: 100%;  background-color: #003196; transition: all 0.4s; z-index: 5; padding-top: 60px;display:none; }
.menu-content ul {  list-style: none;  padding: 0; text-align: center;}
.menu-content li { margin-bottom: 10px;}
.menu-content a {  color: white; text-decoration: none; font-size: 2em; display: block; padding: 10px;}
.menu-content.is-open { left: 0;}
.menu-icons {text-align: center;}
.menu-icons a{display: inline-block;width:3em;height:2em;padding:0.5em 0;border:1px solid #aaa;border-radius: 50%;;margin: 2em 0.5em}
#js-menu-content .menu-icons a img{height:2em;width:auto}

@media screen and (max-width:800px) {
#topHeader {height:20vw;position: fixed;top:0;left:0;width:100%;border-bottom-width: 2vw;z-index: 1}
#topHeader h1 {margin:0;position: absolute;top:4vw;left:4vw;width:22vw}
.menu-content, .menu-btn { display:block}
#headerRight {display: none}
}

#topImage{width:100%;height:54vw;background-image: url(./img/bg1.jpg);background-size:cover;position: relative;}
#topImage .title{color:white;position: absolute;top:6.5vw;left:0;text-align:center;width: 100%;font-size:2.5vw;line-height:1.4em;text-shadow: 2px 2px 10px #000}
#topImage .title strong{font-weight:bold;}
#topImage .title span{font-size:0.6em;letter-spacing:0.1em}
#topImage img{width:3.8em;height:auto;margin-top:0.5em}

#topImage .concept{width:50vw;position: absolute;bottom:2.3vw;right:0;color:#fff;font-size:1.4vw;text-shadow: 2px 2px 10px #000}
#topImage .concept h2{font-size:1.5em;font-style: italic;border-bottom:2px solid #aaa;margin-bottom: 0.3em;font-family: serif}
#topImage .concept p{width:44vw;margin:0;}

@media screen and (max-width:800px) {
#topImage{margin-bottom:66vw;}
#topImage .title{top:8vw;;font-size:4vw}
#topImage .concept{width:95vw;bottom:-53vw;color:#000;font-size:3.5vw;text-shadow: none;}
#topImage .concept p{width:88vw;margin:0;font-size:1em: }

}




#service{max-width:1000px;margin:8em auto;padding-bottom:10em;background-image: url(./img/bg3.jpg);background-repeat: no-repeat;background-position: top left;background-size: 700px}
#service h2 {font-size:1em;font-weight:normal}
#service h2 em{font-size:5em;font-style: normal;font-weight: bold}
#service h2::first-letter{color:var(--yellow)}
.naiyou{display: flex; flex-direction: space-between; justify-content: space-between;margin:0;padding:0;  flex-wrap: wrap;}
.naiyou div{width:45%;margin:0;padding:0;}
.naiyou div:first-child{padding-top:6em}
.naiyou h3{font-size:1.7em;border-bottom:3px solid #fabe00;margin:0 0 0.4em 0;padding:0}
.naiyou img{width:100%;height:auto;border-radius:0.8em;}
.naiyou p{margin-bottom:5em;}

#svLink{display: block;width: 20em;text-align: center;margin:0 auto;padding:0.4em 0;font-size: 1.8em;text-decoration: none ;border-radius:0.4em;background:var(--blue);color:#fff;box-shadow: 5px 5px 5px rgba(0,0,0,0.2);position: relative;}
#svLink::after{content:"";display:block;height:5em;width:4em;position:absolute;right:-1em;top:-0.3em;background-image:url(./img/fig3.png);background-size:contain;background-repeat:no-repeat}

@media screen and (max-width:800px) {
#service{max-width:80%;background-size: 100%;margin:1em auto 5em auto;background-position-y:1.4em;}
#service h2 {margin-bottom:3em;text-align: center}
#service h2 em{font-size:3em;}
.naiyou div{width:100%;}
.naiyou div:nth-child(1){padding-top:0}
.naiyou img{width:100%;height:auto;border-radius:0.8em;}
#svLink{width: 100%;font-size: 1em;padding:1em 0;}

}


.bg2{background:#eee;padding:12em 0 15em 0;transform:skewY(-5deg);}
#recruit {max-width:1000px;margin:0 auto;transform:skewY(5deg);}
#recruit h2 {font-size:1em;font-weight:normal;margin-bottom:5em}
#recruit h2 em{font-size:5em;font-style: normal;font-weight: bold}
#recruit h2::first-letter{color:var(--yellow)}

.kyujin{display: flex; flex-direction: space-between; justify-content: space-between;margin:0;padding:0;  flex-wrap: wrap;}
.kyujin .rc1{width:38%;padding-top:0.5em}
#nigo{;width:100%;padding:2em 3em 1em 3em;box-sizing:border-box;border-radius: 0.8em;box-shadow: 6px 6px 12px #aaa;background:#fff}
#nigo h4{margin:0;font-size:1.2em;text-align: center;border-bottom:1px solid #aaa}
#nigo a{display: block;width:80%;margin:1em auto 0 auto;text-align:center;text-decoration: none;border:1px solid red;padding:0.7em 0;color:red}
#nigo a:hover{background:#ffdbdb}
.kyujin .rc2{width:55%;margin-top:-13em}
.kyujin .rc2 h4{margin:0 0 3.3em 0;font-size:1.7em;text-align:center;color:#d42525}
.kyujin .rc2 h3{background:var(--blue);margin:0;clear: left;color:yellow;text-align: center;padding:0.3em 0;border-radius: 0.5em;border:3px solid #658fe6;border-color: #658fe6 #002269 #002269 #658fe6;font-size:1.6em}
.kyujin .rc2 p{margin:1em  0 3em 0;}
.kyujin .rc2a {padding-left:35%; position: relative;}
.kyujin .rc2a img{position: absolute;left:0;top:0;width: 33%;height:auto}


#rcLink{display: block;width: 20em;text-align: center;margin:1em auto 0 auto;padding:0.4em 0;font-size: 1.8em;text-decoration: none ;border-radius:0.4em;background:var(--yellow);color:#000;box-shadow: 5px 5px 5px rgba(0,0,0,0.2);position: relative;}
#rcLink::after{content:"";display:block;height:3em;width:3em;position:absolute;right:0.2em;top:0.1em;background-image:url(./img/fig4.png);background-size:contain;background-repeat:no-repeat}

@media screen and (max-width:800px) {
.bg2 {padding:5em 0 8em 0}
#recruit h2{text-align: center}
#recruit h2 em{font-size:3em;}
#recruit {max-width:80%;}
#nigo{;padding:2em 1em 1em 1em;}
.kyujin .rc1{width:100%;}
.kyujin .rc2{width:100%;margin-top:2em}
.kyujin .rc2 h4{font-size:1.4em;margin-top:2em}
.kyujin .rc2a {padding-left:40%; }
.kyujin .rc2a img{width: 38%;}
#rcLink{width: 100%;font-size: 1em;padding:1em 0;}
#rcLink::after{height:4em;width:4em;right:-1em;top:-0.3em;}
}

#company{padding:2em 0 2em 0;max-width:1000px;margin:0 auto;text-align: right;position: relative;}
#company .hoshiki {margin-right:3em}
#company .hoshiki img{height:14em; width:auto}
#company .fig2{position: absolute;left:4em;bottom:0;height:400px;width: auto}
#company .fig3{position: absolute;left:8em;bottom:0;height:400px;width: auto;margin-bottom:2em;box-shadow: 5px 5px 10px rgb(0 0 0 /0.2)}

@media screen and (max-width:800px) {
#company{text-align: center;width:80%}

#company .fig2{display: none}
#company .fig3{ width:80%;height:auto;margin-bottom:2em;position:static;}
#company .hoshiki {margin-right:0;text-align: center;}
#company .hoshiki img{height:auto; width:100%}
}


/* 下位ページ */
h1.pagetitle{text-align: center;margin:0;padding:5vw 0 7vw 0;font-weight: normal;font-size:1.4em;background-image: url(./img/bg2.jpg);background-position: center;background-size:cover;}
h1.pagetitle strong{font-size:1.4em}
#mainArea{max-width:1000px;margin:0em auto 5em auto;}
#mainArea h2{padding-left:1.2em;position: relative;line-height:1em;font-size:1.2em}
#mainArea h2::before{content:"";display:block;width:1em;height:1em; background:var(--yellow);position:absolute;left:0;top:0;border-radius:50%}
#formArea{margin:3em 0 0 0;} 

/* フォーム*/
input,button,select,textarea { -webkit-appearance: none;-moz-appearance: none; appearance: none; background: transparent; border: none; border-radius: 0; font: inherit;outline: none;}
textarea { resize: vertical;}
input,textarea,select {width: 100%;padding: 0.5em 0.75em;border: 3px solid #ccc;border-radius:20px; box-sizing: border-box;}
input:focus,textarea:focus,select:focus { outline: 2px solid #2684ff; outline-offset: 2px;}
.formArea {border:1px solid #aaa;padding:4em 6em;margin:4em 0;border-radius: 2em}
.formArea button,input[type="submit"],input[type="button"] { padding: 0.5rem 1rem; border-radius: 2em; border: none; background: var(--blue); color: #fff; cursor: pointer;margin:3em auto 0 auto;width:12em;display:block;}
.pricvacy{text-align:right;}
#pricvacy{margin:8em 0}

@media screen and (max-width:800px) {

h1.pagetitle img{}
#mainArea{width:80%;}
	}

/* 会社概要 */
#about{margin:6em 0}
#about h3{text-align:center;font-size:2em;margin-bottom: 3em}
#about table{border-collapse: collapse;width:100%}
#about th{border-bottom:3px solid  var(--blue);padding:1em 0;width:14em}
#about tr:first-child th{border-top:3px solid  var(--blue);}
#about th span{font-size:0.8em;font-weight: normal;letter-spacing: 0.2em}
#about td{border-bottom:3px solid #aaa;padding:1em 0 1em 1em }
#about tr:first-child td{border-top:3px solid #aaa}
#map {margin:8em 0}
#map iframe{width:100%;height:600px}

@media screen and (max-width:800px) {
#about h3{font-size:1.3em}
#about th{width:7em}
}
 

/* 求人 */
.copy2{margin:2em 0 4em 0;padding:0;font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho" , serif; color:#555}
.copy2 li{transform: rotate(-4deg);font-size:1.8em;list-style:none;letter-spacing: -0.1em;margin:0 0 0 0;padding:0;}
.copy2 li:nth-child(1){margin-left:4em}
.copy2 li:nth-child(2){margin:0 0 0 12em;}
.copy2 li:nth-child(3){margin:0.8em 0 0 2em ;}
.copy2 li:nth-child(4){margin:-2.3em 0 0 22em;}
.copy2 li:nth-child(5){margin:1em 0 0 8em;}
.copy2 li strong{color:#d42525}
.copy2 li::before{content:"“ ";}
.copy2 li::after{content:" ”";}
.copy2+h4{text-align: center;font-size:1.6em;margin:0 0 3em 0;color:var(--red)}
.bosyu{text-align: center;font-size:1.4em;margin-top:2em;color:var(--red);border:1px solid var(--red);padding:0.5em}

#nigoList{margin-bottom:8em}
#nigoList caption{padding:0.5em 0;background: var(--blue);text-align: center;color:#fff;font-size:1.4em;margin:0}
#nigoList table{width:100%;border-collapse:collapse;}
#nigoList th{width:8em;border-bottom:2px solid var(--yellow);padding:0.5em 0}
#nigoList td{;border-bottom:2px solid #aaa;padding:0.5em}


@media screen and (max-width:800px) {

.copy2 li{font-size:1.05em;padding-top:0.5em}
.copy2 li:nth-child(1){margin-left:1em}
.copy2 li:nth-child(2){margin:-0.3em 0 0 4.5em;}
.copy2 li:nth-child(3){margin:0 0 0 0 ;}
.copy2 li:nth-child(4){margin:-0.5em 0 0 3em;}
.copy2 li:nth-child(5){margin:0 0 0 0em;}
.copy2+h4{font-size: 1.4em;}
#nigoList th{width:6em;}
}

 /* お問合せ */


 
 
#footer{background:black;color:#fff;padding:3em 0 0.5em 0;text-align:center;}
#footer img{width:8em}
#footer p{text-align:center;line-height:1.2em}
#footer a{color:#fff}
#footer .copy{font-size:0.9em;text-align: right;margin:3em 3em 0 0}