@charset "utf-8";

/* -------------------------------------------------------------------
メインビジュアル
------------------------------------------------------------------- */
.mv{
	background:url(../images/mv/wave.svg) no-repeat #fff 100% 101%;
	padding:8em 0 8em;
}
@media screen and (min-width:768px){
.mv{
	background:url(../images/mv/wave.svg) no-repeat #fff 100% 101%;
	padding:4em 0 20em;
	}
}

.mv p{
	text-align:center;
	width:min(90%,900px);
	margin: 0 auto;
}
.mv-main{
	background:#171c61;
	margin:0px 0 0;
}

@media screen and (min-width:768px){
.mv-main{
	margin:-60px 0 0;
	}
}
.mv-inner{
	width:min(90%,900px);
	margin: 0 auto;
}


.mv-inner_img ul{
	display:grid;
	grid-template-columns:1fr 1fr 1fr ;
	gap: 10px 20px;
	margin:0 0 80px;
	padding:20px 0 0;
}
.mv-inner_detail{
	width:min(90%,650px);
	margin: 0 auto 0px;
	color:#fff;
}
.mv-inner_detail .mv-text_main{
	font-size:clamp(22px,3vw,33px);
	margin:0px 0 50px;
	text-align: center;
	line-height:1.8;
	letter-spacing:4px;
	font-family:var(--text-family);
	font-weight:500;
}
.mv-inner_detail .mv-text{
	font-size:clamp(14px,3vw,16px);
	margin:0px 0 100px;
	text-align: center;
	line-height:2.2;
	letter-spacing:2px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
}
/* -------------------------------------------------------------------
採用について
------------------------------------------------------------------- */
.recruit-main{
	background:#fff;
	background-size:100%;
	padding:5em 0 ;
}
@media screen and (min-width:768px){
.recruit-main{
	padding:10em 0 ;
	}
}
.recruit-inner{
	width:min(90%,900px);
	margin: 0 auto;
	color:#171c61;

}
.recruit-inner h3{
	max-width:60%;
	margin:0px auto 30px;
	text-align:center;
}
@media screen and (min-width:768px){
.recruit-inner h3{
	max-width:25%;
	}
}
.recruit-text_main{
	font-size:clamp(18px,3vw,33px);
	margin:40px 0 ;
	text-align: center;
	line-height:2;
	letter-spacing:1px;
	font-family:var(--text-family);
	font-weight:500;
}
.recruit-inner .recruit-text{
	font-size:clamp(14px,3vw,16px);
	margin:0px 0 40px;
	text-align: center;
	line-height:2.2;
	letter-spacing:1px;
}
/* -------------------------------------------------------------------
インタビュー
------------------------------------------------------------------- */
.interview-main{
	background:#171c61;
	background-size:100%;
	padding:7em 0 ;
	color:#fff;
}
@media screen and (min-width:768px){
.interview-main{
	padding:15em 0 20em;
	}
}
.interview-inner{
	width:min(90%,900px);
	margin: 0 auto;
}
.interview-inner h3{
	max-width:60%;
	margin:0px auto 30px;
	text-align:center;
}
@media screen and (min-width:768px){
.interview-inner h3{
	max-width:25%;
	}
}
.interview-inner .interview-text{
	font-size:clamp(14px,3vw,16px);
	margin:40px 0 ;
	text-align: center;
	line-height:2.2;
	letter-spacing:1px;
}
.interview-grid figure{
	text-align:center;
}


.interview-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap: 80px 10px;
}
@media screen and (min-width:768px){
.interview-grid{
	gap: 180px 40px;
	margin:120px 0 0 ;
	}
.interview-grid .interview-last{
	grid-column:1 / span 2;
	}

.last-img{
	max-width:430px;
	margin: 0 auto;
	}
	
}

.interview-grid dl{
	text-align:center;
	margin:20px 0 20px;
	letter-spacing:2px;
}
@media screen and (min-width:768px){
.interview-grid dl{
	margin:30px 0 30px;
	}
}

.interview-grid dl dt{
	font-size:clamp(15px,3vw,16px);
	line-height:2.2;
}
.interview-grid dl dt span{
	font-size:clamp(18px,3vw,20px);
}
.interview-grid dl dd{
	font-size:clamp(12px,3vw,16px);
}
.interview-grid .interview-btn{
	text-align:center;
	font-size:clamp(13px,3vw,16px);
	letter-spacing:1px;
}
.interview-grid .interview-btn .bgskew{
    display: inline-block;
    color:#fff;
    padding: 10px 16px;
    text-decoration: none;
    outline: none;
    /*背景の色と形状*/
    background: linear-gradient(180deg, #193cff 0%, #193cff 25%, #516BFF 51%, #516BFF 100%);
    background-position: 1% 40%;
    background-size: auto 200%;
    /*アニメーションの指定*/
    transition: all 0.2s ease-out;
}
.interview-grid .interview-btn .bgskew:hover{
    color: #fff;
    background-position: 50% 99%;
}

@media screen and (min-width:768px){
.interview-grid .interview-btn .bgskew{
	padding: 18px 60px;
	}
}
@media screen and (max-width:767px){
	.interview-name-slash {
		display: none;
	}
}

/* -------------------------------------------------------------------
雇用形態
------------------------------------------------------------------- */
.employment-main{
	background:#fff;
	background-size:100%;
	padding:5em 0 1em;
}
@media screen and (min-width:768px){
.employment-main{
	padding:10em 0 ;
	}
}
.employment-inner{
	width:min(90%,900px);
	margin: 0 auto;
}
.employment-inner h4{
	font-size:clamp(22px,3vw,35px);
	margin:0 0 60px;
	letter-spacing:4px;
	font-family:var(--text-family);
	color:#171c61;
}

.employment-inner table{
	width:100%;
	margin: 0 auto 0px;
	font-size:clamp(14px,3vw,15px);
	letter-spacing:1px;

}
@media screen and (max-width:768px){
.employment-inner table{
	margin: 0 auto 80px;
	}
}

.employment-inner table tr{
	border-bottom:1px solid #171c61;
	padding:40px 0;
}
@media screen and (max-width:768px){
.employment-inner table tr{
	border-bottom:none;
	}
}
.employment-inner table th,
.employment-inner table td{
	padding:40px 0;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
}
.employment-inner table th{
	width:30%;
	color:#171c61;
}
@media screen and (max-width:768px){
.employment-inner table th{
	width:100%;
	background:#E1E3F9;
	display:block;
	padding:10px 10px;
	}
.employment-inner table td{
	padding:10px 10px 40px;
	display:block;
	width:100%;
	}
}

.employment-inner table .table-text{
	line-height:2;
	letter-spacing:1px;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
}
.employment-inner table .table-indent{
	display:block;
	margin:20px 0 0;
}
.employment-inner table .table-notice{
	font-size:.8rem;
	display:block;
}

.employment-inner table dl{
	margin:30px 0 0;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
}
.employment-inner table .last--dl{
	margin:0px 0 0px;
}

.employment-inner table dl dd{
	line-height:1.75;
/*	text-indent:-.5em;
	padding-left:.5em;*/
}
.employment-inner table dl ul li{
	text-indent:-.5em;
	padding-left:.5em;
}
.employment-inner table dl ul li:before{
	content:"・";
}
/* -------------------------------------------------------------------
データで見る西村住建商事
------------------------------------------------------------------- */
.date-main{
	background:#fff;
	padding:5em 0 ;
}
@media screen and (min-width:768px){
.date-main{
	padding:15em 0 ;
	}
}
.date-inner{
	width:min(90%,900px);
	margin: 0 auto;
}

.date-inner h4{
	font-size:clamp(22px,3vw,35px);
	margin:0 0 40px;
	text-align:center;
	letter-spacing:2px;
	font-family:var(--text-family);
	color:#171c61;
}
.date-inner .form-text{
	font-size:clamp(14px,3vw,16px);
	margin:0 0 20px;
	text-align:center;
	letter-spacing:2px;
	line-height:2.2;
	color:#171c61;
}
.date-inner .left{
	font-size:clamp(22px,3vw,35px);
	margin:100px 0 20px;
	text-align:left;
}
.date-inner .dategrid{
	margin:60px auto 10px;
	
}
.date-inner .dategrid ul{
	display:grid;
	gap:10px;
}
@media screen and (min-width:768px){
.date-inner .dategrid ul{
	gap:25px;
	}
}
.date-inner .dategrid .grid-a{
	grid-template-columns:1fr 1fr;
}
@media screen and (min-width:768px){
.date-inner .dategrid .grid-a{
	grid-template-columns:repeat(3,1fr);
	}
}
.date-inner .dategrid .grid-b{
	grid-template-columns:1fr;
	margin:10px 0;
}
@media screen and (min-width:768px){
.date-inner .dategrid .grid-b{
	grid-template-columns:repeat(2,1fr);
	margin:25px 0;
	}
}
.date-inner .dategrid .grid-c{
	grid-template-columns:1fr;
}
.date-inner .date-notice{
	text-align:right;
	font-size:.65rem;
	letter-spacing:1px;
	color:#171c61;
}

.date-glaf{
	display:grid;
	gap:10px;
	grid-template-columns:repeat(1,1fr);
}
@media screen and (min-width:768px){
.date-glaf{
	gap:0px;
	grid-template-columns:repeat(2,1fr);
	}
}

.date-glaf div{
	padding:20px 20px 20px 0;
	border-top:#171c61 1px solid;
	color:#171c61;
}
@media screen and (min-width:768px){
.date-glaf div{
	padding:30px 40px 30px 0px;
	border-top:#171c61 1px solid;
	color:#171c61;
}
.date-glaf div.display{
	border-right:#171c61 1px solid;
	}
.date-glaf div.none{
	padding:30px 20px 30px 20px;
	}
}

.date-glaf div dt{
	font-size:clamp(18px,3vw,20px);
	background:url(../images/date/q.png) no-repeat 0% 5%;
	background-size:28px;
	margin:10px 0 20px;
	letter-spacing:2px;
	padding-left:40px;
	font-family:var(--text-family);
}


.date-glaf div dd{
	font-size:clamp(14px,3vw,14px);
	letter-spacing:2px;
	background:url(../images/date/a.png) no-repeat 0% 5%;
	background-size:28px;
	padding-left:40px;
}
.date-glaf div dd ul li{
	margin:5px 0;
	text-indent:-.5em;
	padding-left:.5em;
}
.date-glaf div dd ul li:before{
	content:"・";
}

/* -------------------------------------------------------------------
会社理念
------------------------------------------------------------------- */
.philosophy-main{
	background:#171c61;
	background-size:100%;
	padding:7em 0 ;
	color:#fff;
}
@media screen and (min-width:768px){
.philosophy-main{
	padding:25em 0 ;
	}
}
.philosophy-inner{
	width:min(80%,900px);
	margin: 0 auto;
}
.philosophy-inner h3{
	max-width:60%;
	margin:0px auto 30px;
	text-align:center;
}
@media screen and (min-width:768px){
.philosophy-inner h3{
	max-width:25%;
	}
}

.philosophy-inner .space-margin_philosophy{
	margin:100px auto 30px;
}
@media screen and (min-width:768px){
.philosophy-inner .space-margin_philosophy{
	margin:180px auto 30px;
	}
}

.philosophy-inner dl{
	letter-spacing:2px;

}
.philosophy-inner dt{
	font-size:clamp(17px,3vw,30px);
	text-align:center;
	margin:30px 0 ;
	font-family:var(--text-family);
}
@media screen and (min-width:768px){
.philosophy-inner dt{
	margin:60px auto;
	}
}
.philosophy-inner dd{
	font-size:clamp(14px,3vw,16px);
	margin:20px 0 ;
	text-align: justify;
	line-height:2.2;
}
@media screen and (min-width:768px){
.philosophy-inner dd{
	text-align: center;
	margin: 0 auto;
	}
	.philosophy-text {
		text-align: left!important;
		width: 398px;
	}
}

.philosophy-speech {
	font-size: 1rem;
	margin: 80px auto 0;
	width: 540px;
	line-height: 1.8;
}

.philosophy-speech span.philosophy-speech-name {
	display: block;
	text-align: right;
	font-size: 1.4rem;
	margin-top: 16px;
	font-family:var(--text-family);
	letter-spacing: 0.3rem;
}

.philosophy-speech span.philosophy-speech-position {
	font-size: 1rem;
}

@media screen and (max-width:767px){
	.philosophy-speech {
		font-size: 0.9rem;
		margin: 80px auto 0;
		width: 100%;
		line-height: 2;
	}

	.philosophy-speech span.philosophy-speech-name {
		display: block;
		text-align: right;
		font-size: 1.4rem;
		margin-top: 16px;
		font-family:var(--text-family);
		letter-spacing: 0.3rem;
	}

	.philosophy-speech span.philosophy-speech-position {
		font-size: 1rem;
	}
}

/* -------------------------------------------------------------------
会社概要
------------------------------------------------------------------- */
.company-main{
	background:#fff;
	background-size:100%;
	padding:5em 0 ;
}
@media screen and (min-width:768px){
.company-main{
	padding:10em 0 8em;
	}
}
.company-inner{
	width:min(90%,900px);
	margin: 0 auto;
}

.company-inner h4{
	font-size:clamp(22px,3vw,35px);
	margin:0 0 60px;
	letter-spacing:4px;
	font-family:var(--text-family);
	color:#171c61;
}
.company-inner table{
	width:100%;
	margin: 0 auto 80px;
	font-size:clamp(14px,3vw,15px);
	letter-spacing:1px;
}
@media screen and (max-width:768px){
.company-inner table{
	margin: 0 auto 0px;
	}
}

.company-inner table tr{
	border-bottom:1px solid #171c61;
	padding:40px 0;
}
@media screen and (max-width:768px){
.company-inner table tr{
	border-bottom:none;
	padding:0px 0;
	}
}

.company-inner table th,
.company-inner table td{
	padding:40px 0;
}
@media screen and (max-width:768px){
.company-inner table th,
.company-inner table td{
	padding:10px ;
	width:100%;
	display:block;
	}
}

.company-inner table th{
	width:30%;
	color:#171c61;

}
@media screen and (max-width:768px){
.company-inner table th{
	width:100%;
	background:#E1E3F9;
	}
.company-inner table td{
	padding:10px 10px 40px;
	}
}

.company-inner table .government,
.company-inner table .bank{
	display:grid;
	gap:5px 0;
}
@media screen and (max-width:768px){
.company-inner table .government{
	margin:0px 0;
	}
}


.company-inner table .location .color{
	color:#171c61;
	width:180px;
	display:inline-block;
}
.company-inner table .location .color:before{
	color:#171c61;
	content:"●";
}
.company-inner table .location .gpin{
	color:#171c61;
	display:inline-block;
	margin:0 10px;
	background:url(../cmn/images/gpin.png) no-repeat 0% 50%;
	padding-left:10px;
}
.company-inner table .location .indent{
	padding-left:1em;
}



.company-inner table .location-main {
	margin:0 0 40px;
}
.company-inner table .location-main ul{
	display:inline-block;
	margin:0 20px;
}
@media screen and (max-width:768px){
.company-inner table .location-main ul{
	margin:0 0px;
	}
}

.company-inner table .location-main ul .fax_block{
	display:inline-block;
	margin:0 10px;
}


.company-inner table .location-branch dl{
	display:flex;
	margin:5px 0;
}
@media screen and (max-width:768px){
.company-inner table .location-branch dl{
	margin:10px 0;
	}
.company-inner table .location-branch .last--child{
	margin:10px 0 0 ;
	}
}

.company-inner table .location-branch dt:before{
	color:#171c61;
	content:"■";
}
.company-inner table .location-branch dt{
	width:140px;
}

.company-inner table .location-branch ul .fax_block{
	display:inline-block;
	margin:0 10px;
}
@media screen and (max-width:768px){
.company-inner table .location-branch ul .fax_block{
	margin:0 0px;
	}
}

/* -------------------------------------------------------------------
応募方法
------------------------------------------------------------------- */
.from-main{
	background:url(../images/form/bg.png) no-repeat 50% 50% #171c61;
	background-size:100%;
	padding:5em 0 ;
	color:#fff;
}
@media screen and (min-width:768px){
.from-main{
	background:url(../images/form/bg.png) no-repeat 50% 50% #171c61;
	background-size: contain;
	padding:10em 0 8em;
	}
}
.from-inner{
	width:min(90%,900px);
	margin: 0 auto;
}

.from-inner h4{
	font-size:clamp(22px,3vw,35px);
	margin:0 0 40px;
	text-align:center;
	letter-spacing:2px;
	font-family:var(--text-family);
}
.from-inner .form-text{
	font-size:clamp(14px,3vw,16px);
	margin:0 0 20px;
	text-align:center;
	letter-spacing:2px;
	line-height:2.2;
}
.from-inner .form-text span{
	display:block;
	font-size:clamp(14px,3vw,18px);
	margin:20px 0;
}
.from-inner ul{
	margin:40px 0 0;
	display:flex;
	justify-content:center;
	gap: 0 40px;
}
@media screen and (min-width:768px){
.from-inner ul{
	margin:60px auto 0;
	display:flex;
	justify-content:space-between;
	max-width:600px;
	}
}