@charset "UTF-8";
@media screen and (max-width: 767px)  {
/*
########################################################
  Common
########################################################
*/
body {
    width:100%;
    min-width:320px;
    -webkit-text-size-adjust:100%;
    overflow-x:hidden;
    font-size:14px;
}
h2{
	font-weight:bold;
	font-size:30px;
	color:#000;
    padding:0px 0px 5px 40px;
	margin:30px 0 40px 0;
	line-height:120%;
}
h2 .Parent{
	font-size:20px;
	display:block;
	line-height:100%;
}
h3{
    font-size:22px;

}
h4{
    font-size  : 22px;
    margin: 10px 0 10px 0;
}
h5{
	font-size  : 18px;
}
h6{
	font-size  : 16px;
}
#Content,s
#Content img,
#Content p,
#Content div,
#Content video{
    max-width:100%;
    height:auto;
}
.iframemap iframe,
.iframemovie iframe{
    max-width:100%;
}
.tableWrap{
overflow: auto;    /*tableをスクロールさせる*/
white-space: nowrap;  /*tableのセル内にある文字の折り返しを禁止*/
}
.tableWrap::-webkit-scrollbar{  /*tableにスクロールバーを追加*/
 height: 5px;
}
.tableWrap::-webkit-scrollbar-track{   /*tableにスクロールバーを追加*/
 background: #f1f1f1;
}
.tableWrap::-webkit-scrollbar-thumb {  /*tableにスクロールバーを追加*/
 background: #bcbcbc;
}
.tableWrap th,
.tableWrap td{
    white-space: nowrap;
}
a.BG.half{
    width:100%;
}
a.pdf,
a.word,
a.doc,
a.docx,
a.excel,
a.xls,
a.xlsx,
a.ppt,
a.pptx{
	padding-left: 45px;
	background-size: 40px 16px;
	background-position:0 3px;
}
a.blank,
a.link{
	padding-left: 35px;
	background-size: 30px 16px;
	background-position:0 3px;
}
input[type=radio] + label,
input[type=checkbox] + span{
    display:block;
    margin-bottom:13px;
}
#Content input[type=radio] + label::before,
#Content input[type=checkbox] + span::before{
    top:4px;
}
#Content input[type=radio]:checked + label::after{
    top:7px;
}
#Content input[type=checkbox]:checked + span::after{
    top:-1px;
}

.PCBlock{
	display:inline;
}
.MobileBlock{
	display:block;
}
.PCnone{
    display:inline;
}
.Mobilenone{
    display:none;
}
#Content .Image02,
#Content .Image03,
#Content .Image04,
#Content .Image05,
#Content .Image06,
#Content .Image07{
    font-size:100%;
}
#Content .Image02 > div,
#Content .Image03 > div{
    width:100%;
    float:none;
    margin:0 0 3em 0 !important;
}
#Content .Image04 > div{
    width:calc(50% - 7px);
    float:left;
    margin:0 0 1em 0 !important;
}
#Content .Image04 > div:nth-child(2n){
    margin:0 0 1em 14px !important;
}
#Content .Image05 > div,
#Content .Image06 > div,
#Content .Image07 > div{
    width:calc(33.3% - 7px);
    float:left;
    margin:0 0 1em 0 !important;
}
#Content .Image05 > div:nth-child(3n+2),
#Content .Image06 > div:nth-child(3n+2),
#Content .Image07 > div:nth-child(3n+2){
    margin:0 10px !important;
}

/* ################## recruit ################## */
#Content .Image05.recruit > div{
    width:calc(50% - 7px) !important;
    float:left !important;
    margin:0 0 1em 0 !important;
}
#Content .Image05.recruit > div:nth-child(2n){
    margin:0 0 1em 14px !important;
}
/* ################## /recruit ################## */
#Content .LRblock{
	display: block;
}
#Content .LRblock > div{
    display: block;
    margin-bottom:1em;
    min-width:10px;
}
#Content .LRblock > div:first-child{
	padding-right:0px;
}
#Content .LRblock > div > img{
    min-width:10px;
	max-width:100%;
}
#Content .LRblock.imgLL > div,
#Content .LRblock.imgLL > div img,
#Content .LRblock.imgLL > div.image,
#Content .LRblock.imgL > div,
#Content .LRblock.imgL > div img,
#Content .LRblock.imgL > div.image,
#Content .LRblock.imgM > div,
#Content .LRblock.imgM > div img,
#Content .LRblock.imgM > div.image,
#Content .LRblock.imgSR > div,
#Content .LRblock.imgSR > div img,
#Content .LRblock.imgSR > div.image,
#Content .LRblock.imgS > div,
#Content .LRblock.imgS > div img,
#Content .LRblock.imgS > div.image,
#Content .LRblock.imgSS > div,
#Content .LRblock.imgSS > div img,
#Content .LRblock.imgSS > div.image{
    width:auto !important;
    min-width:10px !important;
	max-width:100% !important;
	height:auto;
}
#Content .LRblock > div.alignR{
    text-align:right !important;
}
#Content .LRblock.interview{
    display: table;
    width:100%;
}
#Content .LRblock.interview > div{
    display: table-cell;
    min-width:80px;
}
#Content .LRblock.interview > div.border{
    width:80%;
    height:auto;
}
#Content .LRblock.interview > div > img{
    min-width:80px !important;
	max-width:80px !important;
	height:auto;
}
input[type=text],
input[type=email],
input[type=password]{
	min-width:50%;
    width:80%;
	top:0px;
}
textarea{
    min-width:50%;
    width:95%;
	min-height:184px;
}
input[type=submit]{
    cursor:pointer;
    background-image:none;
    -webkit-appearance: none;
}




/* ####################################################################################################### */
#Content .sitemap .Image03 > div{
    width:calc(50% - 1em);
    float:left;
    margin:0 0.5em 1em 0.5em !important;
}
footer{
    font-size:11px;
    min-height: 80px;
}

/* ####################################################################################################### */
.ContentWrap{
    min-width:auto;
}
.ContentWrap .Inside {
    max-width: auto;
    margin: 20px auto 40px auto;
    padding: 0 20px;
}
/*
########################################################
  BreadNavi
########################################################
*/
#BreadNavi {
    width:100%;
    margin:0px;
    padding:3px 10px;
    background:rgba(255,255,255,0.7);
}
/*
########################################################
  topImage
########################################################
*/
.MainImage{
    min-height:100px;
    background-position:right bottom; 
}
.MainImage .Inside{
    padding: 0 20px;
    margin:0 !important;
}
.MainImage h2{
    margin:30px 0px 0 0px;
    padding:0;
    font-size:30px;
}
/*
########################################################
  MainContent
########################################################
*/
#Content .menu2nd li a{
    font-size:11px;
}
#Content .menu2nd li a:hover::after,
#Content .menu2nd li a.current::after{
    bottom:-16px;
}
/*
########################################################
  TopPage
########################################################
*/
.LinkBlockA{
    margin:30px 0px 70px 0px;
    padding:0px 20px 20px 20px;
    min-height:250px;
}

.LinkBlockA img{
    width:100%;
    height:auto !important;
    position: relative;
    left:0px;
    top:-20px;
}
.LinkBlockA.imageR{
    margin:30px 0px 70px 0px;
    padding:0px 20px 20px 20px;
    min-height:250px;
}
.LinkBlockA.imageR img{
    width:100%;
    height:auto !important;
    position: relative;
    left:0px;
    top:-20px;
}
.LinkBlockB.sizeS{
    font-size:12px;
}
.LinkBlockB.sizeS a div strong{
    font-size:12px;
}




}
