.clearfix:after {
content:" ";
display:block;
clear:both;
}

html {
	margin:0;
}



body {
font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
color:#404343;
}

p {margin:0;
word-wrap: break-word;}

ul {margin:0;
padding:0;
list-style:none;}

dd {margin:0;}

main {
	display:block;
}

a {text-decoration:none;
color:#000;}
@media screen and (min-width:480px) {
	

/*----------------------common------------------------------*/

.wrap {
	width:1000px;
	margin:0 auto;
	overflow:hidden;
}



img {
	max-width:100%;
}

.img {
overflow:hidden;
text-indent:500%;
white-space:nowrap;
display:block;
}


.sp {
	display:none !important;
}


h2.title {
	text-align:center;
	margin:30px 0px;
	color:#404343;
	font-size:30px;
	font-weight:normal;
}


/*----------------------header------------------------------*/

header {
height:80vh;
background:url(../images/visual.png) no-repeat;
background-position:center;
background-size:cover;
position:relative;
}

header h1 {
width:160px;
height:137px;
background:url(../images/logo.png) no-repeat;
position:absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}

nav {
padding:20px 0px;
background:#455a64;
}

nav li {
display:inline-block;
margin:0 45px;
}

nav a {
color:white;
font-size:18px;
}

header.recruit {
height:20vh;
background:url(../images/visual.png) no-repeat;
background-position:center;
background-size:cover;
position:relative;
}



/*----------------------footer------------------------------*/

footer {
font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
background:black;
padding-top:20px;
padding-bottom:100px;
color:white;
}


footer div {
border-bottom:1px solid white;
padding:20px 0;
margin-bottom:10px;
}


footer ul a {
color:white;
}

footer small {
display:block;
text-align:center;
}


footer h2 {
color:white;
width:200px;
float:left;
margin:0;
}

footer ul {
float:right;
width:475px;
}

footer ul li {
display:inline-block;
padding:0 15px;
}



/*----------------------info------------------------------*/


main.index section.info {
	margin:80px auto;
    height: 800px;
    overflow-y: scroll;
}
    
main.index section.info dl {
font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
padding:10px 10px 10px 50px;
margin:0;
border-bottom:1px solid #bbbbbb;
}


main.index section.info dl dt {
	display:table-cell;
	width:150px;
	line-height:26px;
	padding-right:10px;
	font-weight:bold;
	color:#455a64;
}
main.index section.info dl dd {
	display:table-cell;
	width:720px;
	line-height:26px;
}


main.index section.info dl:first-of-type {
border-top:1px solid #bbbbbb;
}




/*----------------------company------------------------------*/


main.index section.company {
	margin:80px auto;
	width:800px;
}

main.index section.company dl {
font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
margin:0;
border-bottom:1px solid #bbbbbb;
border-left:1px solid #bbbbbb;
border-right:1px solid #bbbbbb;
}


main.index section.company dl dt {
	display:table-cell;
	width:150px;
	line-height:26px;
	padding-right:10px;
	font-weight:bold;
	color:#455a64;
	background:#f6f6f6;
	padding:10px 15px;
	border-right:1px solid #bbbbbb;
	vertical-align:middle;
}
main.index section.company dl dd {
	display:table-cell;
	width:610px;
padding:10px 15px;
	line-height:26px;
}


main.index section.company dl:first-of-type {
border-top:1px solid #bbbbbb;
}

main.index section.company dl dd input {
	width:90%;
}

main.index section.company dl dd textarea {
width:90%;
height:200px;
}

p.sendbutton {
text-align:center;
margin:20px;
}
p.sendbutton button {
width: 200px;
color: #FFFFFF;
padding:10px;
border: none;
background-color:#455a64;
cursor: pointer;
text-align: center;

}


/*----------------------contents------------------------------*/


main.index section.contents {
margin:80px 0;
}

main.index section.contents article {
overflow:hidden;
}


main.index section.contents article a {
display:block;
width:33.3%;
float:left;
position:relative;
overflow:hidden;
height:280px;
background:black;
}

main.index section.contents article a:nth-of-type(2) {
width:33.3%;

}

main.index section.contents article a img {
width:100%;
height: 100%;
vertical-align:bottom;
opacity:0.4;
transition:0.5s;
}

main.index section.contents article a span {
font-size:30px;
color:white;
display:block;
width:200px;
height:50px;
text-align:center;
position:absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
font-weight:bold;
}


main.index section.contents article a:hover img {
	opacity:1;
}









}

/*----------------------banner------------------------------*/

section.banner {
    margin: 0 auto;
}

section.banner a img {
    display: block;
    margin: 0 auto;
    border: 1px solid #cccccc;
    box-shadow: 2px 3px 10px 0 rgba(0, 0, 0, .2);
}

section.banner a:hover img {
    opacity: 0.7;
}

/*-----------------------------------------------------------------SP----------------------------------------------------------------------------*/


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



/*----------------------common------------------------------*/

.wrap {
	width:98%;
	margin:0 auto;
	overflow:hidden;
}



img {
	max-width:100%;
}

.img {
overflow:hidden;
text-indent:500%;
white-space:nowrap;
display:block;
}

.pc {
	display:none !important;
}


h2.title {
	text-align:center;
	margin:30px 0px;
	color:#404343;
	font-size:24px;
	font-weight:normal;
}


/*----------------------header------------------------------*/



/*ナビメニューのスタイルを指定*/
nav.NavMenu{
position: fixed; /*表示位置を固定*/
z-index: 2; /*重ね順を変更*/
top: 0; /*表示位置を指定*/
left: 0; /*表示位置を指定*/
background: #fff;/*背景を白にする*/
color: #000; /*文字色を黒にする*/
text-align: center; /*テキストを中央揃え*/
width: 100%; /*全幅表示*/
transform: translateY(-100%); /*ナビを上に隠す*/
transition: all 0.6s; /*アニメーションの時間を指定*/
}

nav.NavMenu ul{
background: #fff; /*背景をグレーにする*/
width: 100%;
margin: 0 auto;
padding: 0;
}

nav.NavMenu ul li{
font-size: 1.1em;
list-style-type: none;
padding: 0;
width: 100%;
border-bottom: 1px dotted #333;
}

nav.NavMenu ul li:last-child{
padding-bottom: 0;
border-bottom: none; /*最後のメニュー項目のみ下線を消す*/
}

nav.NavMenu ul li a{
display: block; /*クリックできる領域を広げる*/
color: #000;
padding: 1em 0;
}
nav.NavMenu.active{
transform: translateY(0%);
}

/*トグルボタンのスタイルを指定*/
.Toggle {
display: block;
position: fixed;    /* bodyに対しての絶対位置指定 */
right: 13px;
top: 12px;
width: 42px;
height: 42px;
cursor: pointer;
z-index: 3;
background:black;
}

.Toggle span {
display: block;
position: absolute;
width: 30px;
border-bottom: solid 3px white;
-webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
-moz-transition: .35s ease-in-out;		/*変化の速度を指定*/
transition: .35s ease-in-out;			/*変化の速度を指定*/
left: 6px;
}

.Toggle span:nth-child(1) {
top: 9px;
}

.Toggle span:nth-child(2) {
top: 18px;
}

.Toggle span:nth-child(3) {
top: 27px;
}

/* 最初のspanをマイナス45度に */
.Toggle.active span:nth-child(1) {
top: 18px;
left: 6px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}

/* 2番目と3番目のspanを45度に */
.Toggle.active span:nth-child(2),
.Toggle.active span:nth-child(3) {
top: 18px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
}

header {
height:80vh;
background:url(../images/visual.png) no-repeat;
background-position:center;
background-size:cover;
position:relative;
}

header h1 {
width:160px;
height:137px;
background:url(../images/logo.png) no-repeat;
position:absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}

nav {
padding:20px 0px;
background:#455a64;
}

nav li {
display:inline-block;
}

nav a {
color:white;
font-size:18px;
}


header.recruit {
height:20vh;
background:url(../images/visual.png) no-repeat;
background-position:center;
background-size:cover;
position:relative;
}
/*----------------------footer------------------------------*/

footer {
font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
background:black;
padding-top:20px;
padding-bottom:100px;
color:white;
}


footer div {
border-bottom:1px solid white;
padding:20px 0;
margin-bottom:10px;
}


footer ul a {
color:white;
}

footer small {
display:block;
text-align:center;
}


footer h2 {
color:white;
text-align:center;
margin:0;
}

footer ul {
	display:none;
}
footer ul li {
display:inline-block;
padding:0 15px;
}



/*----------------------info------------------------------*/


main.index section.info {
    width: 90vw;
	margin:50px auto;
}
.info .infobox {
    height: 80vh;
    overflow-y: scroll;
    }
    
main.index section.info dl {
font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
padding:10px;
margin:0;
border-bottom:1px solid #bbbbbb;
}


main.index section.info dl dt {
	line-height:26px;
	padding-right:10px;
	font-weight:bold;
	color:#455a64;
}
main.index section.info dl dd {
	line-height:26px;
}


main.index section.info dl:first-of-type {
border-top:1px solid #bbbbbb;
}




/*----------------------company------------------------------*/


main.index section.company {
margin:80px auto;

}

main.index section.company dl {
font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
margin:0;
border-bottom:1px solid #bbbbbb;
border-left:1px solid #bbbbbb;
border-right:1px solid #bbbbbb;
}


main.index section.company dl dt {
line-height:26px;
padding-right:10px;
font-weight:bold;
color:#455a64;
background:#f6f6f6;
padding:10px;
border-bottom:1px solid #bbbbbb;
}
main.index section.company dl dd {
padding:10px;
line-height:26px;
}


main.index section.company dl:first-of-type {
border-top:1px solid #bbbbbb;
}







/*----------------------contents------------------------------*/


main.index section.contents {
margin:80px 0;
}

main.index section.contents article {
overflow:hidden;
}


main.index section.contents article a {
display:block;

position:relative;
overflow:hidden;
height:200px;
background:black;
}



main.index section.contents article a img {
width:100%;
height: 100%;
vertical-align:bottom;
opacity:0.4;
transition:0.5s;
}

main.index section.contents article a span {
font-size:24px;
color:white;
display:block;
width:200px;
height:50px;
text-align:center;
position:absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
font-weight:bold;
}
main.index section.company dl dd input {
	width:90%;
}

main.index section.company dl dd textarea {
width:90%;
height:200px;
}

p.sendbutton {
text-align:center;
margin:20px;
}
p.sendbutton button {
width: 200px;
color: #FFFFFF;
padding:10px;
border: none;
background-color:#455a64;
cursor: pointer;
text-align: center;

}






}