@charset "UTF-8";
/* 
	
CSS page.css */



/* 
ベース：base { color: #191919; } 
黒：black { color: #000; }
白：white { color: #fff; }
ライトグレー：light { color: #f0f0f0; }
グレー：grey { color: #aaa; }
赤：red { color: #ff0000; }
黄色：yellow { color: #ffff00; }
キーカラーA：colorA { color: #d60a0f; }

border：#ccc
bg：#f7f7f7
*/







/*//////////////////


#index


//////////////////*/

/* common */
#index {  }
@media screen and (max-width: 767px) { 
}

/* #sec_1 */
#index #swrap_1 { background: #f7f7f7; }
#index #sec_1 { }
#index #sec_1 .insec { display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
#index #sec_1 .insec .indextitle { margin-right: 40px; display: flex; flex-direction: column; flex-shrink: 0; }
#index #sec_1 .insec .news {  }
#index #sec_1 .insec .news dt { width: 95px; float: left; }
#index #sec_1 .insec .news dd { text-align: left; padding-left: 105px; margin-bottom: 10px; }
#index #sec_1 .insec .news dd:last-child { margin-bottom: 0px; }
#index #sec_1 .insec .btnbox a { width: 150px; margin-left: 30px; }
@media screen and (max-width: 1040px) {
	#index #sec_1 .insec{ display: block; }
	#index #sec_1 .insec .indextitle { margin-right: 0px; display: block; }
	#index #sec_1 .insec .news { width: 100%; margin-bottom: 15px; }
	#index #sec_1 .insec .news:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; overflow:hidden; line-height:0; font-size: 0; }
	#index #sec_1 .insec .news li { margin-bottom: 10px; }
	#index #sec_1 .insec .news dt{ width: 100%; float: none; color: #d60a0f; }
	#index #sec_1 .insec .news dd{ padding-left: 0; }
	#index #sec_1 .insec .news dd:last-child{ margin-bottom: 0; }
	#index #sec_1 .insec .link { width: 100%; text-align: center; }
}


/* #sec_2 */
#index #swrap_2 { background: #d60a0f; text-align: center; }
#index #sec_2 { }
#index #sec_2 .logo { margin: 20px 0 40px; width: 294px; display: inline-block; }
#index #sec_2 .txt { font-size: 20px; color: #fff; line-height: 2.1; font-weight: bold; }
@media screen and (max-width: 1040px) {
	#index #sec_2 .txt { font-size: 16px; }
}
@media screen and (max-width: 767px) {
	#index #sec_2 .logo { margin: 0px 0 30px; width: 225px;  }
	#index #sec_2 .txt { font-size: 16px; line-height: 2; font-weight: normal; text-align: justify; }
}


/* #sec_3 */
#index #swrap_3 { background: #f7f7f7; text-align: center; }
#index #sec_3 .bgbox { margin-bottom: 20px; }
#index #sec_3 .imglist { margin-top: 30px; display: flex; flex-direction: row; justify-content: center; width: 100%; margin-left: auto; margin-right: auto; }
#index #sec_3 .imglist>li { }
#index #sec_3 .imglist>li .img { height: 320px; }
#index #sec_3 .imglist>li:nth-child(1) { margin-right: 80px; }
#index #sec_3 .imglist>li:nth-child(1) .img>img { width: 348px; }
#index #sec_3 .imglist>li:nth-child(2) .img>img { width: 300px; }
#index #sec_3 .imglist>li .txt { margin-top: 20px; font-size: 1.13em; font-weight: bold; font-feature-settings : "palt"; }
@media screen and (max-width: 1040px) {
	#index #sec_3 .imglist>li:nth-child(1) { margin-right: 40px; }
	#index #sec_3 .imglist>li:nth-child(1) .img>img { width: 258px; }
	#index #sec_3 .imglist>li:nth-child(2) .img>img { width: 240px; }
	#index #sec_3 .imglist>li .img { height: auto; }
}
@media screen and (max-width: 767px) {
	#index #sec_3 .bgbox .txt1 { text-align: justify; }
	#index #sec_3 .imglist { margin-top: 30px; display: block; width: 100%; }
	#index #sec_3 .imglist>li { }
	#index #sec_3 .imglist>li:nth-child(1) { margin-right: 0; margin-bottom: 30px; }
	#index #sec_3 .imglist>li .img { max-width: 320px; width: 90%; text-align: center; }
	#index #sec_3 .imglist>li .img { margin: 0 auto; }
	#index #sec_3 .imglist>li .txt { margin-top: 15px; font-size: 15px;  }
}


/* #sec_4 */
#index #sec_4 { }
#index #sec_4 .postbox>li { margin-bottom: 0px; }
@media screen and (max-width: 767px) {
	#index #sec_4 .postbox>li{ margin-bottom: 30px; }
}


/* #sec_5 */
/*
#index #swrap_5 { background-image: url(../img/index/s5_bg.jpg); min-height: 300px; margin-bottom: 100px;
    background-position: center center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover; }
*/
#index #swrap_5 { background-image: url(../img/index/s5_bg.jpg); margin-bottom: 100px; background-size: cover; background-position: center center; background-attachment: scroll; }
#index #sec_5 { text-align: center; }
#index #sec_5 .indextitle { color: #fff;  }
#index #sec_5 .txtstyle1 { letter-spacing: -0.01em; }
#index #sec_5 .txt { color: #fff;}
@media screen and (max-width: 767px) {
	#index #swrap_5 { margin-bottom: 60px; background-size: cover; background-position: center center; background-attachment: scroll; }
	#index #sec_5 .txt { text-align: justify; }
}











/*//////////////////


#about


//////////////////*/

/* common */
#about {  }
@media screen and (max-width: 767px) {
}
	
/* #sec_intro */
#about #sec_intro { }
@media screen and (max-width: 767px) {
}

/* #sec_1 */
#about #sec_1 .copybox { display: flex; justify-content: center; align-items: center; margin-bottom: 40px; }
#about #sec_1 .copybox .txtstyle1 { text-align: left; margin-left: 30px; margin-bottom: 0; }
#about #sec_1 .copybox .company { background: #191919; padding: 20px; line-height: 1; color: #fff; }
#about #sec_1 .txtstyle1 { font-feature-settings: "palt"; text-align: center; letter-spacing: 0.03em; }
#about #sec_1 .name { text-align: right; }
@media screen and (max-width: 1040px) {
	#about #sec_1 .copybox { display: block; margin-bottom: 30px; }
	#about #sec_1 .copybox .txtstyle1 { margin-left: 0px; }
	#about #sec_1 .copybox .company { background: none; padding: 0; margin-bottom: 20px; color: #191919; }
	#about #sec_1 .name { text-align: left; }

}

/* #sec_2 */
#about #sec_2 ul>li { margin-bottom: 30px; }
#about #sec_2 ul li:last-child { margin-bottom: 0; }
#about #sec_2 ul li dl { display: flex; justify-content: space-between; align-items: flex-start; }
#about #sec_2 ul li dt { width: 140px; margin-right: 10px;  }
#about #sec_2 ul li dd { width: calc(100% - 150px); }
@media screen and (max-width: 767px) { 
	#about #sec_2 ul li { margin-bottom: 20px; }
	#about #sec_2 ul li>dl { display: block; padding: 0; }
	#about #sec_2 ul li>dl>dd { width: 100% }
	#about #sec_2 ul li>dl>dd .txt { padding-left: 0!important; text-indent: 0;  }
	#about #sec_2 ul li>dl>dt { width: 100%; text-align: justify; margin-top: 5px; font-weight: bold; }
}

/* #sec_3 */
#about #sec_3 ul li { background: #f7f7f7; padding: 40px 60px; margin-bottom: 10px; }
#about #sec_3 ul li a { margin-left: 20px; }
@media screen and (max-width: 767px) {
	#about #sec_3 ul li { padding: 6%;; }
	#about #sec_3 ul li a { margin-left: 0px; display: block;  }

}











/*//////////////////


#cando


//////////////////*/

/* common */
#cando .insec { margin-bottom: 60px; padding-bottom: 60px; border-bottom: 1px solid #191919; }
#cando .insec .panel { font-size: 18px; background: #d63a3a; padding: 10px; line-height: 1; color: #fff; display: inline-block; margin-bottom: 20px; }
#cando .insec .txtbig1 { margin-bottom: 20px; }
#cando .insec .imgbox .bold { margin-top: 20px; text-align: center; }
#cando .insec:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
@media screen and (max-width: 1040px) {
	#cando .insec { margin-bottom: 40px; padding-bottom: 40px; }
	#cando .insec .panel { font-size: 1em; padding: 5px; margin-bottom: 10px; }
	#cando .insec .txtbig1 br { display: none; }
	#cando .insec .imgbox img { width: 80%; max-width: 320px; margin: 0 auto; display: block; }
}
	
/* #sec_intro */
#cando #sec_intro { }
@media screen and (max-width: 767px) {
}

/* #sec_1 */
#cando #sec_1 .insec:nth-child(3) .imgbox { width: 38%; }
#cando #sec_1 .insec:nth-child(3) .txtbox { width: 55%; }
@media screen and (max-width: 1040px) {
	#cando #sec_1 .insec:nth-child(3) .imgbox img { width: 100%; max-width: none; }
	#cando #sec_1 .insec .txtbox { margin-bottom: 30px; }

}

/* #sec_2 */
#cando #sec_2 .txtstyle2 { background: #f7f7f7; padding: 40px; text-align: center; }
@media screen and (max-width: 1040px) {
	#cando #sec_2 .txtstyle2 { background: #f7f7f7; padding: 6%; text-align: center; }	
}














/*//////////////////


#recruit


//////////////////*/

/* common */
#recruit #main .txtbig1 { margin-bottom: 30px; }
@media screen and (max-width: 767px) {
	#recruit #main .txtbig1 { margin-bottom: 20px; }
}

/* #sec_1 */
#recruit #sec_1 {  }
@media screen and (max-width: 767px) {
	#recruit #sec_1 { }
}

/* #sec_2 */
#recruit #sec_2 .insec { display: flex; align-items: center; }
#recruit #sec_2 .insec .sectitle { width: 230px; margin-bottom: 0; }
#recruit #sec_2 .insec .sectitle .txt { color: #fff; }
#recruit #sec_2 .insec .inbox { width: calc(100% - 230px); color: #fff; }
@media screen and (max-width: 1040px) {
	#recruit #sec_2 .insec { display: block; }
	#recruit #sec_2 .insec .sectitle { margin-bottom: 20px; width: 100%; }
	#recruit #sec_2 .insec .inbox { width: 100%; }
}

/* #sec_3 */
#recruit #sec_3 .insec { display: flex; justify-content: space-between; align-items: flex-start; }
#recruit #sec_3 .insec#is_1 .imgbox { width: 300px; }
#recruit #sec_3 .insec#is_1 .imgbox img { margin-bottom: 20px; max-width: 280px; }
#recruit #sec_3 .insec#is_1 .txtbox { width: calc(100% - 330px); }
#recruit #sec_3 .insec#is_1 .question { font-weight: bold; }
#recruit #sec_3 .insec#is_1 .question:before { content:"Q"; padding-right: 10px; font-size: 30px; font-family: Lato, "Lato", serif; color: #d60a0f; }
#recruit #sec_3 .insec#is_1 .answer { margin-bottom: 30px; }
#recruit #sec_3 .insec#is_2  { align-items: center; background: #f7f7f7; justify-content: center; margin-top: 40px; }
#recruit #sec_3 .insec#is_2 .imgbox { width: 50%; }
#recruit #sec_3 .insec#is_2 .txtbox { width: 50%; box-sizing: border-box; padding: 6%; }
#recruit #sec_3 .insec#is_2 .panel { font-weight: bold; background: #191919; padding: 10px; line-height: 1; color: #fff; display: inline-block; margin-bottom: 20px; }
@media screen and (max-width: 1040px) {
	#recruit #sec_3 .insec { display: block; }
	#recruit #sec_3 .insec .imgbox,
	#recruit #sec_3 .insec .txtbox { width: 100%!important; }
	#recruit #sec_3 .insec#is_1 .imgbox { text-align: center; margin-bottom: 40px; }
	#recruit #sec_3 .insec#is_1 .imgbox img { margin: 0 auto 20px; display: block; }
	#recruit #sec_3 .insec#is_2  { margin-top: 10px; }
	#recruit #sec_3 .insec#is_2 .panel { padding: 10px; }
}
@media screen and (max-width: 767px) {
	#recruit #sec_3 .insec#is_2 .txtbox { padding: 8% 6%; }
	#recruit #sec_3 .insec#is_1 .question:before { padding-right: 5px; font-size: 24px;}
}


/* #sec_4 */
#recruit #sec_4 ul>li { margin-bottom: 30px; }
#recruit #sec_4 ul li:last-child { margin-bottom: 0; }
#recruit #sec_4 ul li dl { display: flex; justify-content: space-between; align-items: flex-start; }
#recruit #sec_4 ul li dt { width: 140px; margin-right: 10px;  }
#recruit #sec_4 ul li dd { width: calc(100% - 150px); }
@media screen and (max-width: 767px) { 
	#recruit #sec_4 ul li { margin-bottom: 20px; }
	#recruit #sec_4 ul li>dl { display: block; padding: 0; }
	#recruit #sec_4 ul li>dl>dd { width: 100% }
	#recruit #sec_4 ul li>dl>dd .txt { padding-left: 0!important; text-indent: 0;  }
	#recruit #sec_4 ul li>dl>dt { width: 100%; text-align: justify; margin-top: 5px; font-weight: bold; }
}












/*//////////////////


#news


//////////////////*/

/* common */
#news {  }
@media screen and (max-width: 767px) { 
}

/* #sec_1 */
#news #sec_1 li { padding: 40px 60px; background: #fff; margin-bottom: 10px; }
#news #sec_1 li:last-child { margin-bottom: 0; }
#news #sec_1 dl { display: flex; justify-content: space-between; width: 100%; }
#news #sec_1 dl dt { width: 110px; }
#news #sec_1 dl dd { width: calc(100% - 120px); }
@media screen and (max-width: 767px) { 
	#news #sec_1 li { padding: 6%; }
	#news #sec_1 dl { display: block; }
	#news #sec_1 dl dt { width: 100%; }
	#news #sec_1 dl dd { width: 100%; }
}












/*//////////////////


#works.index


//////////////////*/

#works.index #sec_1 .navbox { margin-bottom: 50px; padding: 40px 60px; background: #fff; box-sizing: border-box; text-align: center; }
#works.index #sec_1 .navbox a { font-size: 18px; font-weight: bold; text-decoration: none; margin: 0 10px; display: inline-block;}
#works.index #sec_1 .navbox a.current,
#works.index #sec_1 .navbox a:hover { text-decoration: underline; color: #d60a0f; }
@media screen and (max-width: 1180px) { 
	#works.index #sec_1 .navbox ul { padding: 60px; }
}
@media screen and (max-width: 767px) { 
	#works.index #sec_1 .navbox { padding: 6%; }
	#works.index #sec_1 .navbox a { font-size: 1em; }
}












/*//////////////////


#works.under


//////////////////*/

/* #sec_intro */
#works.under #sec_intro .outline { font-size: 20px; margin-top: 30px; margin-bottom: 10px; }
#works.under #sec_intro .outline li { display: inline-block; margin: 0 10px; }
#works.under #sec_intro .desc { text-align: center; margin-right: 20px; }
#works.under #sec_intro .desc li { display: inline-block; margin: 0 5px; }
#works.under #sec_intro .desc li:before { content: '・'; }
#works.under #sec_intro .type { background: #191919; padding: 10px; line-height: 1; color: #fff; display: inline-block; margin-top: 20px; min-width: 120px; }
@media screen and (max-width: 767px) { 
	#works.under #sec_intro .outline { font-size: 1em; }
	#works.under #sec_intro .outline li { display: block; margin: 0; }
	#works.under #sec_intro .desc { text-align: left; }
	#works.under #sec_intro .desc li { display: block; margin: 0; }
	#works.under #sec_intro .type { background: #191919; padding: 10px 20px; min-width: 0; }
}

/* #sec_1 */
#works.under #sec_1 .tags { margin-top: 60px; text-align: left; }
#works.under #sec_1 .tags a { margin-right: 20px; text-decoration: none; }
#works.under #sec_1 .tags a:hover { text-decoration: underline; }
#works.under #sec_1 .tags a:before { content: "#"; }

/* #sec_2 */
#works.under #sec_2 { margin-top: 80px; }
#works.under #sec_2 .txt1 { text-align: center; color: #d60a0f; font-size: 20px; margin-bottom: 10px; }
@media screen and (max-width: 767px) { 
	#works.under #sec_2 { margin-top: 40px; }
}

/* .snsbtnbox */
#works.under .snsbtnbox { display: flex; justify-content: center; align-items: center; }
#works.under .snsbtnbox li a { width: 260px; height: 70px; margin: 5px; position: relative; display: block; box-sizing: border-box; background: #fff; text-align: center; text-decoration: none; line-height: 70px; }
#works.under .snsbtnbox li a:hover { color: #fff; background: #191919; }
#works.under .snsbtnbox li a svg { width: 30px; height: 20px; fill: #191919; vertical-align: -3px; }
#works.under .snsbtnbox li a:hover svg { fill: #fff; }
@media screen and (max-width: 1040px) { 
	#works.under .snsbtnbox li a { border-radius: 50%; width: 50px; height: 50px; margin: 5px; line-height: 1; }
	#works.under .snsbtnbox li a svg { width: 30px; height: 20px; position: absolute; margin: auto; top: 0; bottom: 0; left: 0; right: 0; }
	#works.under .snsbtnbox li a span { display: none; }
}



















/*//////////////////


#contact


//////////////////*/

/* common */
form .formbox>ul { }
form .formbox>ul>li { margin-bottom: 30px; text-align: left; }
form .formbox>ul>li:last-child { margin-bottom: 0 }
form .formbox>ul>li>dl { display: flex; justify-content: space-between; }
form .formbox>ul>li>dl>dt { width: 180px; padding-top: 25px }
form .formbox>ul>li>dl>dt { padding-top: 25px; }
form .formbox.check>ul>li>dl>dt { padding-top: 0; }
form .formbox>ul>li>dl>dd { width: calc(100% - 200px); }
form .formbox>ul>li>dl>dd>ul.tategroup>li { margin-bottom: 10px }
form .formbox>ul>li>dl>dd>ul.tategroup>li:last-child { margin-bottom: 0; }
form .formbox>ul>li>dl>dd>ul.yoko>li{ margin-left: 20px; display: inline-block; }
form .formbox>ul>li>dl>dd>ul.yoko{ margin-left: -20px }
form .policy { padding: 40px; background: #f7f7f7; height: 200px; overflow: scroll; margin-bottom: 60px; }
@media screen and (max-width: 767px) { 
	form .formbox>ul>li>dl{ flex-direction: column }
	form .formbox>ul>li>dl>dt{ width: 100%; padding-right: 0; padding-top: 0; margin-bottom: 10px }
	form .formbox>ul>li>dl>dd{ width: 100%; }
	form .policy { padding: 6%; }
}
@media screen and (max-width: 639px) { 
	form .formbox>ul>li>dl>dd>ul.yoko>li{ display: block; }
}

/* radiocheck */
form .formbox>ul>li.radiocheck { padding: 35px 0; }
form .formbox>ul>li.radiocheck>dl { padding-bottom: 45px; }
form .formbox>ul>li.radiocheck>dl:last-child { padding-bottom: 0px; }
form .formbox>ul>li.radiocheck>dl>dt { padding-top: 0; }
form .formbox>ul>li.radiocheck>dl>dd>ul>li { display: inline-block; margin-right: 15px; }
@media screen and (max-width: 767px) { 
	form .formbox>ul>li.radiocheck { padding: 20px 0; }
	form .formbox>ul>li.radiocheck>dl { padding-bottom: 30px; }
	form .formbox>ul>li.radiocheck>dl>dd>ul>li { display: inline-block; margin-right: 15px; }
}


/* #sec_form */
#contact #sec_form .txt1 { margin-bottom: 40px; }
@media screen and (max-width: 767px) { 
	#contact #sec_form .txt1 { margin-bottom: 20px; }
}

#contact #cnt_thanks { text-align: center; }
#contact #cnt_thanks .tel { font-size: 24px; }