@charset "utf-8";
/* CSS Document */
section{ margin: 80px auto 0; z-index: 100;}
#contentsMenu ul{ display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; max-width: 1100px; margin: 30px auto 0; font-size: 90%;}
#contentsMenu li{ background: #ededed; width: 32%; height: auto; box-sizing: border-box; letter-spacing: 0; position: relative; margin: 0 7px;}
#contentsMenu li a{ color: #000; width: 100%;  height: 100%; border:#FFF solid 1px; display: block; box-sizing: border-box;  padding: 10px; z-index: 10;}
#contentsMenu li:hover{ opacity: 0.7; text-decoration: none!important; }
#contentsMenu li::after{ content: ">"; color: #000; position: absolute; right: 0; top: 0; padding: 10px;}
#contentsMenu li span{ margin: 0 -5px;}

#index #contentsMenu li:nth-of-type(1) a{ background: #CCC;}
#auction #contentsMenu li:nth-of-type(2) a{ background: #CCC;}
#sealing #contentsMenu li:nth-of-type(3) a{ background: #CCC;}

body#index{ background:url("../img/recruit_bg.jpg") top center no-repeat; background-size:contain; background-color: #f8f8f5; background-position: left 0 top 70px,center;}
body#auction{ background:url("../img/recruit_bg.jpg") top center no-repeat; background-size:contain; background-color: #f8f8f5; background-position: left 0 top 70px,center;}
body#sealing{ background:url("../img/recruit_bg.jpg") top center no-repeat; background-size:contain; background-color: #f8f8f5; background-position: left 0 top 70px,center;}

body#index figure{ width: 100%; margin: 30px 0 30px!important; }
body#sealing figure{ width: 100%; margin: 0 0 50px!important; }
body#auction figure{ width: 100%; margin: 0 0 50px!important; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
body#auction figure img{ width: 49%;}

table{ margin: 0 0 50px; width: 100%;}
table td,table th{ padding: 10px; border: #DDD 1px solid;}
table th{ background-color: #f8f8f5; width: 20%;}
table td ul li{ list-style:disc; margin: 0 0 0 15px;}

body#index h2{ font-size: 160%; margin: 50px 0 0 0;}

#kubunBtn { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; margin: 0 0 30px;}
#kubunBtn li{ width: 48%;}
#kubunBtn li a.btn{ width: 100%;}

@media screen and (max-width: 1100px) {
#contentsMenu ul{ display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content:  space-between; max-width: 1100px; margin: 50px auto 0; flex-wrap: wrap; padding: 0 0;}
#contentsMenu li{ background: #ededed; width: calc(50% - 3px); height: auto; box-sizing: border-box; letter-spacing: 3px; position: relative; margin: 3px 0;}

}

@media screen and (max-width: 640px) {
section{ margin: 30px auto 0; z-index: 100;}
#contentsMenu ul{ display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; max-width: 1100px; margin: 10px auto 0; padding: 0 0;}
#contentsMenu li{ background: #ededed; width: calc(50% - 3px); height: auto; box-sizing: border-box; letter-spacing: 0px; position: relative; margin: 3px 0; font-size: 80%;}

table td,table th{ font-size: 80%; line-height: 160%;}

body#auction h2+p{ font-size: 100%; margin: 0; text-align: center; line-height: 160%; margin: 30px 0 0;}


ul#kubun{ margin: 10px 0 30px 0; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; flex-wrap: wrap;}
ul#kubun li{ background: #f2f2f2; width: 100%; padding: 20px; text-align: center; font-size: 120%; margin: 20px 0 0 0;}
ul#kubun li span{ font-size: 150%; display: block;}
#kubunBtn { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; margin: 20px 0 30px; flex-wrap: wrap;}
#kubunBtn li{ width: 100%;}
}