@charset "utf-8";

/*--------------------------------------------------------------------------------------------------

   page

--------------------------------------------------------------------------------------------------*/


/*------------------------------------------------------------------------------------------------
  index
--------------------------------------------------------------------------------------------------*/
.top01 {
	width: 96%;
	max-width: 1220px;
	margin: 0 auto;
	text-align: center;
}

.top02 {
	width: 96%;
	max-width: 1220px;
	margin: 0 auto;
	padding: 100px 0 40px;
	position: relative;
}

.top02:before {
	position: absolute;
	top: 58px;
	left: calc( 50% + 46px);
	background: url(../image/top02-02.png) no-repeat 0 0;
	width: 598px;
	height: 346px;
	content: "";
	z-index: -1;
}

.top02 h2 {
	margin: 0 0 0 54px;
}

.top02 .cont {
	display: flex;
	margin: 40px 0 0;
}

.top02 .cont .text {
	width: 546px;
	margin: 0 0 0 16px;
	line-height: 2.2;
}

.dot01 {
	background: url(../image/dot-01.png);
}

.top03 {
	width: 94%;
	max-width: 1100px;
	margin: 0 auto;
	padding: 50px 0;
}

.top03 h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	letter-spacing: 0.04em;
}

.top03 h2 span {
	position: relative;
	z-index: 3;
	margin: 0 0 20px;
}

.top03 h2 span:before {
	position: absolute;
	bottom: -3px;
	left: 0;
	content: "";
	background-color: #f39700;
	width: 100%;
	height: 24px;
	z-index: -1;
}

.top03 .reason {
	display: flex;
	justify-content: space-between;
}

.top03 .reason .photo {
	margin: 60px 0 0;
}

.top03 .reason .box {
	position: relative;
	width: 290px;
	display: flex;
	flex-direction: column;
}

.top03 .reason .box .num {
	position: absolute;
	top: -4px;
	left: 0;
	z-index: 10;
	color: #f39800;
	font-size: 60px;
	font-weight: bold;
	font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.top03 .reason .box .num::first-letter {
  color: #005982;
}

.top03 .reason .box .cont {
	padding: 10px 20px;
	background-color: #FFF;
	flex-grow: 1;
}

.top03 .reason .box .cont h3 {
	font-size: 24px;
	font-weight: bold;
	color: #003567;
	margin-bottom: 8px;
}

.top03 .reason .box .cont p {
	line-height: 1.4;
}

.top04 {
	width: 94%;
	max-width: 1100px;
	margin: 0 auto;
	padding: 50px 0 70px;
}

.top04 h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	font-feature-settings: "palt";
	line-height: 1.3;
	letter-spacing: 0.04em;
	margin-bottom: 36px;
}

.top04 h2 span {
	position: relative;
	z-index: 3;
	margin: 0 0 20px;
}

.top04 h2 span:before {
	position: absolute;
	bottom: -3px;
	left: 0;
	content: "";
	background-color: #f39700;
	width: 100%;
	height: 24px;
	z-index: -1;
}

.top04 .cont {
	display: flex;
	justify-content: space-between;
}

.top04 .cont div {
	width: 200px;
}

.top04 .cont dd {
	margin: 20px 0 0;
}

.top04 .cont dd a {
	display: block;
	position: relative;
	background-color: #D0121B;
	color: #FFF;
	text-decoration: none;
	border-radius: 22px;
	width: 180px;
	margin: 0 auto;
	line-height: 1;
	padding: 14px 24px;
	font-size: 14px;
}

.top04 .cont .last dd a {
	padding: 14px 14px;
}

.top04 .cont dd a:before {
	position: absolute;
	content: "＞";
	color: #FFF;
	top: 14px;
	right: 10px;
	font-size: 14px;
}

.dot02 {
	background: url(../image/dot-02.png);
}

.top05 {
	width: 96%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 50px 0 80px;
	background: url(../image/top05-01.png) no-repeat 100% 60px;
}

.top05 h2 {
	font-size: 60px;
	font-weight: bold;
	color: #FFF;
	letter-spacing: 0.04em;
}

.top05 h2 span {
	position: relative;
	z-index: 3;
	margin: 0 0 20px;
}

.top05 h2 span:before {
	position: absolute;
	bottom: -3px;
	left: 0;
	content: "";
	background-color: #003567;
	width: 100%;
	height: 24px;
	z-index: -1;
}

.top05 .tit {
	display: inline-block;
	border-bottom: 3px solid #000;
}

.top05 .jList {
	display: flex;
	justify-content: space-between;
	width: 1100px;
	margin: 30px auto 0;
}

.top05 .jList div {
	font-size: 14px;
	font-weight: bold;
}

.topNews {
	width: 980px;
	margin: 0 auto 60px;
	position: relative;
}

.topNews:before {
	position: absolute;
	top: -136px;
	right: 0;
	content: "";
	background: url(../image/illust-01.png);
	width: 334px;
	height: 234px;
}

.topNews h2 {
	color: #003567;
	font-size: 60px;
	letter-spacing: 0.04em;
	font-weight: bold;
	margin: 80px 0 20px;
}

.topNews h2 span.line {
	position: relative;
}

.topNews h2 span.line:before {
	position: absolute;
	bottom: -3px;
	left: 0;
	content: "";
	background-color: #F39800;
	width: 100%;
	height: 30px;
	z-index: -1;
}

.topNews h2 span.sub {
	font-size: 18px;
	display: inline-block;
	border-bottom: 3px solid #000;
	letter-spacing: 0;
	color: #000;
	margin: 0 0 0 20px;
	vertical-align: 14px;
}

.topNews a {
	text-decoration: none;
	color: #000;
}

.newsList {
	display: flex;
	width: 850px;
	margin: 0 auto 40px;
}

.newsList .photo {
	width: 170px;
	margin: 0 30px 0 0;
}

.newsList .photo img {
	/*max-width: 100%;
	height: auto;*/
}

.newsList .info {
	display: flex;
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 10px;
	line-height: 1.2;
	align-items: center;
}

.newsList .info .cat {
	display: inline-block;
	border: 1px solid #000;
	border-radius: 100vh;
	padding: 2px 10px;
	margin-left: 10px;
	font-size: 14px;
}

.newsList .cont {
	width: calc( 100% - 200px);
	background: url(../image/arrow-01.png) no-repeat 100% center;
}

.newsList .cont p {
	font-size: 24px;
	font-weight: bold;
	width: 90%;
	line-height: 1.6;
}

.btn01 {
	width: 164px;
	margin: 0 auto;
}

.btn01 a {
	display: block;
	position: relative;
	background-color: #D0121B;
	color: #FFF;
	text-decoration: none;
	border-radius: 22px;
	width: 180px;
	margin: 0 auto;
	line-height: 1;
	padding: 16px 24px;
	font-size: 14px;
}

.btn01 a:before {
	position: absolute;
	content: "＞";
	color: #FFF;
	top: 16px;
	right: 10px;
	font-size: 14px;
}

.btn02 {
	width: 164px;
	margin: 0;
}

.btn02 a {
	display: block;
	position: relative;
	background-color: #D0121B;
	color: #FFF;
	text-decoration: none;
	border-radius: 22px;
	width: 180px;
	margin: 0 auto;
	line-height: 1;
	padding: 16px 24px;
	font-size: 14px;
}

.btn02 a:before {
	position: absolute;
	content: "＞";
	color: #FFF;
	top: 16px;
	right: 10px;
	font-size: 14px;
}

.top06 {
	width: 96%;
	max-width: 1100px;
	margin: 0 auto;
	padding: 50px 0 80px;
	position: relative
}

.top06:before {
	position: absolute;
	top: -10px;
	right: 100px;
	content: "";
	background: url(../image/illust-02.png);
	width: 238px;
	height: 128px;
}

.top06 h2 {
	font-size: 60px;
	font-weight: bold;
	color: #003567;
}

.top06 h2 span {
	display: inline-block;
	margin-left: 20px;
	border-bottom: 3px solid #000;
	color: #000;
	font-size: 18px;
	vertical-align: 14px;
}

.top06 ul {
	display: flex;
	justify-content: space-between;
	margin: 0;
	padding: 0;
	list-style: none;
}

.top06 ul li {
	margin: 0;
	padding: 0;
	width: 200px;
}

.top06 ul li a {
	position: relative;
	text-decoration: none;
	display: block;
}

.top06 ul li a h3 {
	display: inline-block;
	background-color: #F39800;
	color: #FFF;
	font-size: 22px;
	position: absolute;
	top: 14px;
	left: 14px;
	padding: 0 6px;
	line-height: 1.6;
}

.top06 ul li a .more {
	color: #FFF;
	border: 1px solid #FFF;
	position: absolute;
	bottom: 14px;
	right: 14px;
	border-radius: 100vh;
	font-size: 10px;
	padding: 4px 14px 3px;
	line-height: 1;
}

.top06 ul li a:hover .more {
	background-color: #FFF;
	color: #000;
}

.color01 {
	background-color: #eff2e5;
}

.top07 {
	width: 96%;
	max-width: 1100px;
	margin: 0 auto;
	padding: 50px 0 40px;
	position: relative
}

.top07:before {
	position: absolute;
	top: -30px;
	right: 197px;
	content: "";
	background: url(../image/illust-03.png);
	width: 232px;
	height: 186px;
}

.top07 h2 {
	font-size: 60px;
	font-weight: bold;
	color: #003567;
}

.top07 h2 span {
	display: inline-block;
	margin-left: 20px;
	border-bottom: 3px solid #000;
	color: #000;
	font-size: 18px;
	vertical-align: 14px;
}

.top07 ul {
	width: 980px;
	display: flex;
	justify-content: space-between;
	margin: 10px auto 36px;
	padding: 0;
	list-style: none;
}

.top07 ul li {
	margin: 0;
	padding: 0;
	width: 220px;
}

.top07 ul li a {
	position: relative;
	text-decoration: none;
	display: block;
}

.top07 ul li a h3 {
	display: inline-block;
	background-color: #000;
	color: #FFF;
	font-size: 22px;
	position: absolute;
	top: 14px;
	left: 14px;
	padding: 0 6px;
}

.top07 ul li a .more {
	color: #FFF;
	border: 1px solid #FFF;
	position: absolute;
	bottom: 14px;
	right: 14px;
	border-radius: 100vh;
	font-size: 10px;
	padding: 4px 14px 3px;
	line-height: 1;
}

.top07 ul li a:hover .more {
	background-color: #FFF;
	color: #000;
}

.recBox {
	background-color: #f39800;
}

.recBox .cont {
	width: 1100px;
	margin: 0 auto;
	padding: 120px 0 1px;
	position: relative;
	color: #FFF;
}

.recBox .cont:before {
	position: absolute;
	top: 30px;
	left: 20px;
	content: "";
	background: url(../image/recbox-01.png);
	width: 552px;
	height: 100px;
}

.recBox .cont:after {
	position: absolute;
 bottom: 0;
	right: 5px;
	content: "";
	background: url(../image/recbox-03.png);
	width: 410px;
	height: 220px;
}

.recBox .cont h2 {
	margin: 0 0 40px;
	text-align: center;
}

.recBox .cont .text {
	text-align: center;
}

.recBox .cont p {
	margin: 0 0 20px;
	text-align: left;
	margin-right: 10px;
	display: inline-block;
}

.recBox .cont .btn01 {
	margin-bottom: 60px;
	position: relative;
	z-index: 2;
}

.contactBox {
	background-color: #EEE;
}

.contactBox .cont {
	width: 1200px;
	margin: 0 auto;
	padding: 80px 0 60px;
	position: relative;
	text-align: center;
}

.contactBox .cont:before {
	position: absolute;
	bottom: -1px;
	left: 0;
	content: "";
	background: url(../image/illust-04.png);
	width: 526px;
	height: 146px;
}

.contactBox .cont .contact01 {
	position: absolute;
	top: 40px;
	left: 240px;
}

.contactBox .cont .contact02 {
	position: absolute;
	top: 90px;
	left: 50%;
}

.contactBox .cont a {
	display: inline-block;
	margin-top: 110px;
}


/*------------------------------------------------------------------------------------------------
  news
--------------------------------------------------------------------------------------------------*/
#news {
}

#news .title {
	position: relative;
	width: 100%;
	height: 300px;
	background-color: #F5F7FB;
}

#news .title h2 {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
	color: #003567;
	font-size: 60px;
	font-weight: bold;
}

#news .newsBox {
	display: flex;
	padding: 110px 0 80px;
	width: 1220px;
	margin: 0 auto;
}

#news .newsBox .cont {
	order: 2;
	width: 850px;
}

#news .newsBox .cont a {
	text-decoration: none;
	color: #000;
}

.pnBtn {
	margin-bottom: 100px;
	text-align: center;
}

.pnBtn a {
	color: #FFF;
}

.pnBtn a.prev {
	display: inline-block;
	position: relative;
	background-color: #D0121B;
	color: #FFF;
	text-decoration: none;
	border-radius: 22px;
	width: 180px;
	margin: 0 5px;
	line-height: 1;
	padding: 16px 24px;
	font-size: 14px;
}

.pnBtn a.prev:before {
	position: absolute;
	content: "＜";
	color: #FFF;
	top: 16px;
	left: 10px;
	font-size: 14px;
}

.pnBtn a.next,
.pnBtn a.all {
	display: inline-block;
	position: relative;
	background-color: #D0121B;
	color: #FFF;
	text-decoration: none;
	border-radius: 22px;
	width: 180px;
	margin: 0 5px;
	line-height: 1;
	padding: 16px 24px;
	font-size: 14px;
}

.pnBtn a.next:before,
.pnBtn a.all:before {
	position: absolute;
	content: "＞";
	color: #FFF;
	top: 16px;
	right: 10px;
	font-size: 14px;
}


#news .newsBox .category {
	order: 1;
	width: 150px;
	margin-right: 100px;
}

#news .newsBox .category ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#news .newsBox .category ul li {
	margin: 0 0 24px;
	padding: 0;
}

#news .newsBox .category ul li a {
	text-decoration: none;
	background: url(../image/arrow-01.png) no-repeat 100% center;
	background-size: 22px;
	line-height: 22px;
	display: block;
	color: #000;
	text-decoration: none;
}

#news .newsDetail .info {
	display: flex;
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 10px;
	line-height: 1.2;
	align-items: center;
}

#news .newsDetail .info .cat {
	display: inline-block;
	border: 1px solid #000;
	border-radius: 100vh;
	padding: 2px 10px;
	margin-left: 10px;
	font-size: 14px;
}

#news .newsDetail h2 {
	font-weight: bold;
	font-size: 24px;
	margin: 0 0 20px;
}

#news .newsDetail .detail {
	padding: 0 0 30px;
}

#news .newsDetail .detail p {
	margin: 0 0 40px;
}

#news .newsDetail .detail h3 {
	font-size: 24px;
	margin: 0 0 10px;
}

#news .newsDetail .detail img {
	max-width: 100%;
	height: auto;
}

#news .newsDetail .detail .wp-caption {
  margin: 0 auto 40px;
  text-align: left;
  max-width: 100%;
}

#news .newsDetail .detail .wp-caption-text {
  display: inline-block;
  text-align: left;
  color: #000;
  margin: 0;
		font-size: 14px;
		font-weight: bold;
}

#news .newsDetail .detail .cap {
		font-size: 14px;
		font-weight: bold;
}

#news .newsDetail .detail a.pdf {
	display: inline-block;
	position: relative;
	background-color: #D0121B;
	color: #FFF;
	text-decoration: none;
	border-radius: 22px;
	margin: 0;
	line-height: 1;
	padding: 12px 24px;
	font-size: 16px;
}

#news .newsDetail .kanren .tit {
	font-size: 24px;
	font-weight: bold;
}

#news .kanren .newsList .cont {
	width: calc( 100% - 200px);
}




/*------------------------------------------------------------------------------------------------
  company
--------------------------------------------------------------------------------------------------*/
#company {
    position: relative;
    overflow: hidden;
}

#company::before {
    position: absolute;
    content: "";
    background-image: url(https://sanyo-k.biz/wp-content/uploads/company-banner.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 733px;
    /* width: calc(100%/2 + 60px); */
    height: 520px;
    top: 0;
    left: calc(50% - 30px);
}

#company .title {
	display: flex;
	justify-content: center;
	position: relative;
}

#company .title:before {
	position: absolute;
	top: 0;
	left: 0;
	width: calc( 50% - 30px);
	height: 100%;
	background-color: #f39800;
	content: "";
	z-index: -1;
}

#company .title .lc {
	width: 550px;
	padding: 80px 0 0;
}

#company .title .lc h2 {
	font-size: 72px;
	color: #FFF;
	line-height: 1.2;
	font-weight: bold;
}

#company .title .lc h2 span {
	font-size: 48px;
	display: block;
}

#company .title .rc {
	width: 550px;
    height: 520px;
	margin-left: 30px;
	padding: 40px 0 0;
	line-height: 2.2;
}

#company .title .rc .sig {
	font-size: 24px;
	text-align: right;
	margin-bottom: 8px;
}

#company .title .rc .sig span {
	font-size: 18px;
	margin-right: 20px;
}

.second .cont01 {
	width: 980px;
	margin: 0 auto;
	padding: 60px 0 100px;
}

.second .greeting {
    width: 980px;
	margin: 0 auto;
	padding: 60px 0 70px;
}

.second .cont02 {
	width: 1100px;
	margin: 0 auto;
	padding: 60px 0 100px;
}

.second .cont01.rinen h2,
.second .cont01.greeting h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin-bottom: 10px;
}

.second .cont01.rinen p {
	display: block;
	background-color: #003567;
	color: #FFF;
	font-size: 24px;
	padding: 8px 16px;
	font-weight: bold;
	text-align: center;
}

.second .cont01.gaiyou h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin-bottom: 10px;
}

.second .cont01.gaiyou .list {
	display: flex;
}

.second .cont01.gaiyou .list div:nth-child(1) {
	width: calc( 50% - 30px);
}

.second .cont01.gaiyou .list div table th {
	text-align: left;
	width: 148px;
	vertical-align: top;
	padding: 6px 0;
}

.second .cont01.gaiyou .list div table td {
	padding: 6px 0;
}

.second .cont01.gaiyou .list div table td.adjust {
	padding-bottom: 25px;
}
	
.color02 {
	background-color: #003567;
}

.second .cont01.enkaku h2 {
	font-size: 48px;
	font-weight: bold;
	color: #FFF;
	margin-bottom: 50px;
}

.second .cont01.enkaku dl {
	display: flex;
	flex-wrap: wrap;
	line-height: 3;
	color: #FFF;
}

.second .cont01.enkaku dt {
	width: 270px;
	font-weight: bold;
}

.second .cont01.enkaku dd {
	width: calc( 100% - 270px);
}

.second .cont02.access h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin-bottom: 20px;
}

.second .cont02.access h3 {
	font-size: 30px;
	font-weight: bold;
	color: #003567;
	margin-bottom: 10px;
}

.second .cont02.access .access01 {
	display: flex;
	justify-content: space-between;
	margin: 0 0 40px;
}

.second .cont02.access .access01 div.oka {
	width: 430px;
}

.second .cont02.access .access01 div.ei {
	width: 640px;	
}

.second .cont02.access .access01 p {
	margin-top: 10px;
}

.second .cont02.access .access01 div.ei p {
    margin-top: 0;
}

.second .cont02.access .access02 {
	display: flex;
	justify-content: space-between;
}

.second .cont02.access .access02 h3 {
	font-size: 24px;
	font-weight: bold;
	color: #003567;
	margin-bottom: 10px;
}

.second .cont02.access .access02 h3 span {
	font-size: 16px;
	color: #a40000;
	margin-left: 10px;
}

.second .cont02.access .access02 p {
	margin-top: 10px;
	line-height: 1.6;
}

.second .cont02.access .onegai {
	background-color: #003567;
	color: #FFF;
	margin: 20px 60px 0;
	padding: 20px 35px;
	border-radius: 20px;
}

.second .cont02.access .onegai dt {
	font-size: 30px;
	font-weight: bold;
}

.second .cont02.access .onegai dt img {
	vertical-align: -6px;
	margin-right: 12px;
}

#company .tumikomi {
	margin: 0 0 30px;
	font-size: 36px;
	color: #FFF;
	font-weight: bold;
	background-color: #003567;
	border-top: 7px solid #ffdc00;
	text-align: center;
	padding: 10px 0;
}



/*------------------------------------------------------------------------------------------------
  sand
--------------------------------------------------------------------------------------------------*/
#sand {
}

#sand .title {
	display: flex;
	justify-content: center;
	position: relative;
	margin-bottom: 50px;
}

#sand .title:before {
	position: absolute;
	top: 0;
	left: 0;
	width: calc( 50% - 30px);
	height: 100%;
	background-color: #DCDCDC;
	content: "";
	z-index: -1;
}

#sand .title:after {
	position: absolute;
	top: 2px;
	right: calc( 50% + 30px);
	width: 578px;
	height: 176px;
	content: "";
	background: url(../image/sand-01.png);
}

#sand .title .lc {
	width: 610px;
	padding: 190px 0 0;
}

#sand .title .lc h2 {
	font-size: 60px;
	color: #FFF;
	line-height: 1.2;
	font-weight: bold;
 font-feature-settings: "palt";
	margin-left: -30px;
}

#sand .title .lc h2 span {
	font-size: 18px;
	display: block;
	margin: 20px 0 80px;
}

#sand .title .rc {
	width: 550px;
	line-height: 2.2;
}

#sand .title .rc img {
	margin-left: -60px;
}

.second .top03 .reason {
	flex-wrap: wrap;
}

#sand .case h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
}

#sand .caseList {
	display: flex;
	flex-wrap: wrap;
}

#sand .caseList .box {
	width: 50%;
	display: flex;
	flex-direction: column;
	border: 1px dashed #A0A0A0;
	position: relative;
}

#sand .caseList .box:nth-child(3),
#sand .caseList .box:nth-child(4),
#sand .caseList .box:nth-child(5),
#sand .caseList .box:nth-child(6),
#sand .caseList .box:nth-child(7),
#sand .caseList .box:nth-child(8) {
	border-top: none;
}

#sand .caseList .box:nth-child(2n) {
	border-left: none;
}

#sand .caseList .box:nth-child(1):before {
	position: absolute;
	background: url(../image/sand-06.png);
	width: 72px;
	height: 144px;
	content: "";
	top: 10px;
	left: 315px;
}

#sand .caseList .box:nth-child(2):before {
	position: absolute;
	background: url(../image/sand-07.png);
	width: 242px;
	height: 116px;
	content: "";
	top: 30px;
	left: 230px;
}

#sand .caseList .box:nth-child(3):before {
	position: absolute;
	background: url(../image/sand-08.png);
	width: 214px;
	height: 104px;
	content: "";
	top: 40px;
	left: 260px;
}

#sand .caseList .box:nth-child(4):before {
	position: absolute;
	background: url(../image/sand-09.png);
	width: 244px;
	height: 132px;
	content: "";
	top: 24px;
	left: 255px;
}

#sand .caseList .box:nth-child(5):before {
	position: absolute;
	background: url(../image/sand-10.png);
	width: 186px;
	height: 74px;
	content: "";
	top: 80px;
	left: 290px;
}

#sand .caseList .box:nth-child(6):before {
	position: absolute;
	background: url(../image/sand-11.png);
	width: 220px;
	height: 154px;
	content: "";
	top: 24px;
	left: 270px;
}

#sand .caseList .box:nth-child(7):before {
	position: absolute;
	background: url(../image/sand-12.png);
	width: 206px;
	height: 112px;
	content: "";
	top: 60px;
	left: 300px;
}

#sand .caseList .box:nth-child(8):before {
	position: absolute;
	background: url(../image/sand-13.png);
	width: 220px;
	height: 84px;
	content: "";
	top: 70px;
	left: 280px;
}


#sand .caseList .box h3 {
	height: 160px;
	font-size: 30px;
	font-weight: bold;
	position: relative;
	color: #003567;
	line-height: 1.4;
	margin: 0 30px;
}

#sand .caseList .box h3 span {
	position: absolute;
 top: 50%;
 left: 0%;
 transform: translateY(-50%);
 -webkit-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
}

#sand .caseList .num {
	border: 1px solid #A0A0A0;
	background-color: #F39800;
	color: #FFF;
	letter-spacing: 0.02em;
	display: inline-block;
	width: 90px;
	text-align: center;
	padding: 2px 0;
}

#sand .caseList .box p.text {
	margin: 0 30px 30px;
}

.goods h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 10px;
}

.goods h2 span.sub {
	font-size: 18px;
	display: inline-block;
	border-bottom: 3px solid #000;
	letter-spacing: 0;
	color: #000;
	margin: 0 0 0 20px;
	vertical-align: 14px;
}

.goods h3 {
	margin: 0 0 24px;
	color: #FFF;
	font-size: 48px;
	font-weight: bold;
	line-height: 1;
	background: url(../image/line-01.png) repeat-x 0 50%;
}

.goods h3 span {
	display: inline-block;
	padding: 18px 18px 14px;
	background-color: #f39800;
}

.goodsList ul {
	margin: 0 0 10px;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
}

.goodsList ul li {
	width: 180px;
	margin: 0 4px 16px 0;
	padding: 0;
	list-style: none;
	position: relative;
	line-height: 1.4;
}

.goodsList ul li:nth-child(6n) {
	margin: 0 0 16px;
}

.goodsList ul li img {
	margin: 0 0 8px;
}

.goodsList ul li a .more {
	color: #FFF;
	border: 1px solid #FFF;
	position: absolute;
	top: 146px;
	right: 14px;
	border-radius: 100vh;
	font-size: 10px;
	padding: 4px 14px 3px;
	line-height: 1;
}

.goodsList ul li a:hover .more {
	background-color: #FFF;
	color: #000;
}

.goodsShiyou {
	background-color: #FFF;
	padding: 30px;
	margin: 30px 0 0;
}

.goodsShiyou h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 10px;
}

.goodsShiyou table {
	width: 100%;
}

.goodsShiyou table th {
	text-align: left;
	border-bottom: 1px solid #EEE;
	padding: 0 8px;
}

.goodsShiyou table th:nth-child(1) {
	width: 200px;
}

.goodsShiyou table th:nth-child(2) {
	width: 240px;
}

.goodsShiyou table th:nth-child(3) {
	width: 340px;
}

.goodsShiyou table td {
	padding: 4px 8px 0;
}

.cont02.goods {
	margin-bottom: -30px;
}

.cont02.goods .atten {
	margin: 10px 40px 0;
}

.tenji {
	width: 980px;
	margin: 80px auto;
	display: flex;
}

.tenji h2 {
	font-size: 36px;
	font-weight: bold;
	line-height: 1.4;
	margin: 0 0 30px;
	color: #003567;
}

.tenji .photo {
	margin-left: 20px;
}

.tenji .photo ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
}

.tenji .photo ul li {
	margin: 0 0 0 10px;
	padding: 0;
}

#sand .top05 {
	padding-bottom: 30px;
}

.cont02.jisseki {
	background-color: #FFF;
	padding: 20px;
}

.cont02.jisseki h3 {
	font-size: 30px;
	font-weight: bold;
	margin: 0 0 10px;
}

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

.cont02.jisseki ul li {
	margin: 0;
	padding: 0;
}

.jissekiList {
	display: flex;
	justify-content: space-between;
}

.dot02.pd {
	padding: 0 0 80px;
}

.faq .faqList.last {
	border-bottom: 1px solid #A0A0A0;
}

.faq h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
}

.faq .faqList {
	border-top: 1px solid #A0A0A0;
	margin-top: -1px;
}

.faq .faqList .q {
	cursor: pointer;
	padding: 30px 100px 30px 0;
	font-size: 24px;
	font-weight: bold;
	background: url(../image/arrow-02.jpg) no-repeat 97% center;
}

.faq .faqList .a {
	font-size: 16px;
	padding: 30px 0;
	display: none;
}

.faq .faqList .q.on {
	background: url(../image/arrow-03.jpg) no-repeat 97% center;
}

#sand .top06:before {
	background: url(../image/illust-05.png);
	width: 318px;
	height: 128px;
	right: 70px;
}


/*------------------------------------------------------------------------------------------------
  golf
--------------------------------------------------------------------------------------------------*/
#golf {
}

#golf .title {
	display: flex;
	justify-content: center;
	position: relative;
	margin-bottom: 50px;
}

#golf .title:before {
	position: absolute;
	top: 0;
	left: 0;
	width: calc( 50% - 30px);
	height: 100%;
	background-color: #32b16c;
	content: "";
	z-index: -1;
}

#golf .title:after {
	position: absolute;
	top: 2px;
	right: calc( 50% + 140px);
	width: 476px;
	height: 176px;
	content: "";
	background: url(../image/golf-01.png);
}

#golf .title .lc {
	width: 610px;
	padding: 190px 0 0;
}

#golf .title .lc h2 {
	font-size: 60px;
	color: #FFF;
	line-height: 1.2;
	font-weight: bold;
 font-feature-settings: "palt";
	margin-left: -30px;
}

#golf .title .lc h2 span {
	font-size: 18px;
	display: block;
	margin: 20px 0 80px;
}

#golf .title .rc {
	width: 550px;
	line-height: 2.2;
	padding: 20px 0 0;
}

#golf .title .rc img {
	margin-left: -30px;
}

#golf .title .rc .text {
	margin: 20px 0 0 -30px;
}

#golf .golf01 {
	background: url(../image/golf-03.png) no-repeat right 20px;
}

#golf .golf01 h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
}


#golf .golf01 .saiteki {
	display: flex;
	margin: 0 0 30px;
}

#golf .golf01 .saiteki .photo {
	margin-right: 60px;
}

#golf .golf01 .saiteki .text {
	margin-right: 20px;
}

#golf .golf01 .saiteki .text h3 {
	color: #005982;
	font-size: 30px;
	font-weight: bold;
	line-height: 1.4;
	margin: 0 0 30px;
}

#golf .golf01 .saiteki .text h3 span {
	display: inline-block;
	position: relative;
	z-index: 10;
}

#golf .golf01 .saiteki .text h3 span:before {
	position: absolute;
	bottom: 6px;
	left: 0;
	content: "";
	background-color: #f39700;
	width: 100%;
	height: 12px;
	z-index: -1;
}

#golf .golf01 .aomori {
	color: #005982;
	font-size: 30px;
	font-weight: bold;
	line-height: 1.4;
	margin: 0 0 60px;
}

#golf .reason {
	display: flex;
	flex-wrap: wrap;
}

#golf .reason .box {
	width: 290px;
	display: flex;
	flex-direction: column;
	position: relative;
	margin: 0 0 70px 55px;
}

#golf .reason .box:nth-child(3n-2) {
	margin: 0 0 70px;
}

#golf .reason .box .num {
	position: absolute;
	top: -60px;
	left: 0;
	z-index: 10;
	color: #f39800;
	font-size: 60px;
	font-weight: bold;
	font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#golf .reason .box .num::first-letter {
  color: #005982;
}

#golf .reason .box .cont {
	padding: 50px 20px 20px;
	flex-grow: 1;
	background-color: #FFF;
}

#golf .reason .box .cont h3 {
	color: #003567;
	font-size: 24px;
	font-weight: bold;
}

#golf .seibun {
	display: flex;
	background-color: #FFF;
	padding: 20px;
	margin: 0 0 40px;
}

#golf .seibun .text {
	width: 340px;
	margin-right: 50px;
}

#golf .seibun .text h3 {
	font-weight: bold;
	font-size: 30px;
	color: #005982;
	line-height: 1.6;
	margin-bottom: 40px;
}

#golf .seibun .text {
	line-height: 2.3;
}

#golf .seibun .text dt {
	font-weight: bold;
	color: #005982;
	font-size: 18px;
	margin-bottom: 10px;
}

#golf .seibun .text dd {
	margin-bottom: 20px;
}

#golf .green {
	background: #834E00;
	padding: 40px;
}

#golf .green h3 {
	line-height: 1.4;
	color: #FFF;
	font-size: 36px;
	font-weight: bold;
	margin: 0 0 20px;
}

#golf .green h3 span {
	color: #f39800;
}

#golf .green .cont {
	display: flex;
	color: #FFF;
}

#golf .green .cont div:nth-child(1) {
	margin-right: 60px;
}

#golf .sonota h2 {
	font-weight: bold;
	font-size: 48px;
	color: #003567;
	line-height: 1.6;
	margin-bottom: 40px;
}

#golf .sonota .sonotaList {
	margin: 0 0 40px;
	display: flex;
}

#golf .sonota .sonotaList .photo {
	margin-right: 40px;
}

#golf .sonota .sonotaList h3 {
	display: inline-block;
	font-size: 36px;
	position: relative;
}

#golf .sonota .sonotaList h3:before {
	position: absolute;
	bottom: 8px;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #000;
	content: "";
}

#golf .omoBox {
	background-color: #FFF;
	padding: 40px 50px 40px 50px;
}

#golf .omoBox h3 {
	line-height: 1.4;
	color: #003567;
	font-size: 48px;
	font-weight: bold;
	margin: 0 0 30px;
}

#golf .omo {
	display: flex;
	background: url(../image/golf-11.jpg) no-repeat 0 0;
	padding: 0 0 0 300px;
}

#golf .omo p {
	margin: 0 0 0 300px;
}

#golf .omo ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#golf .omo ul li {
	margin: 0 0 2px;
	padding: 0;
}

#golf .omo ul:nth-child(1) {
	margin-right: 70px;
}


#golf .golf02 h2 {
	line-height: 1.4;
	color: #003567;
	font-size: 48px;
	font-weight: bold;
	margin: 0 0 30px;
}

#golf .golf02 .kenzai {
	display: flex;
}

#golf .golf02 .kenzai .photo {
	margin-right: 40px;
}

#golf .golf02 .kenzai .text .lead {
	display: inline-block;
	background-color: #F39800;
	color: #FFF;
	font-size: 36px;
	line-height: 1;
	padding: 4px 8px 2px;
	margin: 0 0 30px;
}

#golf .golf02 .kenzai .text h3 {
	position: relative;
	display: inline-block;
	font-size: 24px;
}

#golf .golf02 .kenzai .text h3:before {
	position: absolute;
	bottom: 8px;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #000;
	content: "";
}

#golf .top06:before {
	background: url(../image/illust-05.png);
	width: 318px;
	height: 128px;
	right: 70px;
}

#golf .rm {
	margin: -60px auto 40px;
	background-color: #FFF;
	padding: 40px 46px;
}

#golf .rm h2 {
	line-height: 1.4;
	font-size: 36px;
	font-weight: bold;
	margin: 0 0 30px;
}

#golf .rm .box {
	display: flex;
}

#golf .rm .box .photo {
	width: 385px;
	margin: 0 30px 0 0;
}

#golf .rm .box .photo img {
	display: block;
	margin: 0 0 20px;
}

#golf .rm .box .text {
	line-height: 2.2;
}

#golf .rm .box .text p {
	margin: 0 0 20px;
}




/*------------------------------------------------------------------------------------------------
  sandbox
--------------------------------------------------------------------------------------------------*/
#sandbox {
}

#sandbox .title {
	display: flex;
	justify-content: center;
	position: relative;
	margin-bottom: 50px;
}

#sandbox .title:before {
	position: absolute;
	top: 0;
	left: 0;
	width: calc( 50% - 30px);
	height: 100%;
	background-color: #F8B551;
	content: "";
	z-index: -1;
}

#sandbox .title:after {
	position: absolute;
	top: 2px;
	left: calc( 50% - 608px);
	width: 1024px;
	height: 176px;
	content: "";
	background: url(../image/sandbox-01.png);
}

#sandbox .title .lc {
	width: 610px;
	padding: 190px 0 0;
}

#sandbox .title .lc h2 {
	font-size: 60px;
	color: #FFF;
	line-height: 1.2;
	font-weight: bold;
 font-feature-settings: "palt";
	margin-left: -30px;
}

#sandbox .title .lc h2 span {
	font-size: 18px;
	display: block;
	margin: 70px 0 80px;
}

#sandbox .title .rc {
	width: 520px;
	line-height: 2.2;
	padding: 90px 0 0;
}

#sandbox .title .rc img {
	margin: 0 0 0 -10px;
}

#sandbox .title .rc .text {
	margin: 10px 0 0 0;
}

#sandbox .sb01 h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
}

#sandbox .sb01 .box {
	display: flex;
	justify-content: space-between;
}

#sandbox .sb01 .box .photo {
	width: 491px;
}

#sandbox .sb01 .box .text {
	width: 470px;
}

#sandbox .sb01 .box .text h3 {
	color: #005982;
	font-size: 30px;
	line-height: 1.3;
	font-weight: bold;
	position: relative;
	z-index: 5;
}

#sandbox .sb01 .box .text h3 span {
	display: inline-block;
	position: relative;
}

#sandbox .sb01 .box .text h3 span:before {
	position: absolute;
	bottom: 5px;
	left: 0;
	content: "";
	background-color: #f39700;
	width: 390px;
	height: 12px;
	z-index: -1;
}

#sandbox .sb01 .box .text h3 span.t2:before {
	width: 264px;
}


#sandbox .sb01 .box .text p {
	margin: 16px 0;
	line-height: 2.2;
}

#sandbox .sb02 h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 10px;
}

#sandbox .sb02 .goodsList li {
	margin: 0 21px 16px 0;
}

.second .cont02.sb02 {
	padding: 50px 0;
}

#sandbox .top05 {
	background-image: none;
}

#sandbox .sb01 dl {
	display: flex;
}

#sandbox .sb01 dl dt {
	background-color: #f39700;
	color: #003567;
	margin-right: 10px;
	padding: 3px 10px 0;
	font-weight: bold;
}

#sandbox .sb01 dl dd {
	padding: 3px 0 0;
}

#sandbox .top06:before {
	background: url(../image/illust-05.png);
	width: 318px;
	height: 128px;
	right: 70px;
}


/*------------------------------------------------------------------------------------------------
  clean
--------------------------------------------------------------------------------------------------*/
#clean {
	position: relative;
	overflow: hidden;
}

#clean:before {
	position: absolute;
	background: url(../image/clean-02.jpg) no-repeat 0 0;
	width: 733px;
	height: 316px;
	content: "";
	top: 0;
	left: calc( 50% - 30px);
}

#clean .title {
	display: flex;
	justify-content: center;
	position: relative;
	margin-bottom: 50px;
}

#clean .title:before {
	position: absolute;
	top: 0;
	left: 0;
	width: calc( 50% - 30px);
	height: 100%;
	background-color: #00a0e9;
	content: "";
	z-index: -1;
}

#clean .title:after {
	position: absolute;
	top: 2px;
	left: calc( 50% - 608px);
	width: 640px;
	height: 176px;
	content: "";
	background: url(../image/clean-01.png);
}

#clean .title .lc {
	width: 610px;
	padding: 190px 0 0;
}

#clean .title .lc h2 {
	font-size: 60px;
	color: #FFF;
	line-height: 1.2;
	font-weight: bold;
 font-feature-settings: "palt";
	margin-left: -30px;
}

#clean .title .lc h2 span {
	font-size: 18px;
	display: block;
	margin: 20px 0 80px;
}

#clean .title .rc {
	width: 520px;
	line-height: 2.2;
	padding: 340px 0 0;
}

#clean .title .rc .text {
	margin: 10px 0 0 0;
}

#clean .clean01 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
}

#clean .clean01 .box01 {
	display: flex;
	margin: 0 0 60px;
}

#clean .clean01 .box01 .photo {
	width: 460px;
}

#clean .clean01 .box01 .text {
	width: calc( 100% - 460px);
}

#clean .clean01 .box01 .text h3 {
	font-size: 30px;
	font-weight: bold;
	color: #005982;
	line-height: 1.3;
	margin-bottom: 16px;
}

#clean .clean01 .box01 .text h3 span {
	display: inline-block;
	position: relative;
}

#clean .clean01 .box01 .text h3 span:before {
	position: absolute;
	bottom: 5px;
	left: 0;
	content: "";
	background-color: #f39700;
	width: 100%;
	height: 12px;
	z-index: -1;
}

#clean .clean01 .box01 .text p {
	line-height: 2;
}

#clean .style01 {
	font-size: 48px;
	font-weight: bold;
	color: #005982;
	margin: 0 0 20px;
}

#clean .style01 span {
	display: inline-block;
	position: relative;
}

#clean .style01 span:before {
	position: absolute;
	bottom: 16px;
	left: 0;
	content: "";
	background-color: #f39700;
	width: 100%;
	height: 12px;
	z-index: -1;
}

#clean .style02 {
	margin: 20px 0 30px;
	line-height: 2.3;
}

#clean .clean02 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #FFF;
	margin: 0 0 20px;
}

#clean .clean02 .box01 {
	display: flex;
	margin: 30px 0 0;
	align-items: center;
}

#clean .clean02 .box01 .photo {
	width: 50%;
	margin: 0 30px 0 0;
}

#clean .clean02 .box01 .text {
	width: calc( 50% - 30px);
}

#clean .clean02 .box01 .text dt {
	display: inline-block;
	background-color: #FFF;
	font-size: 30px;
	font-weight: bold;
	padding: 0 10px;
	margin: 0 0 20px;
}

#clean .clean02 ul {
	display: flex;
	margin: 46px 0 0;
	padding: 0;
	list-style: none;
	justify-content: space-between;
}

#clean .clean02 ul li img {
	display: block;
	margin: 0 0 4px;
}

#clean .clean03 h2 {
	font-size: 48px;
	font-weight: bold;
	color: #005982;
	margin: 0 0 30px;
}

#clean .cleanStep {
	display: flex;
	justify-content: space-between;
	margin: 0 0 30px;
}

#clean .cleanStep div {
	width: 300px;
	line-height: 1.4;
}

#clean .cleanStep div img {
	display: block;
	margin-bottom: 20px;
}

#clean .cleanStep .at {
	color: #e60012;
	font-size: 14px;
	display: block;
	margin: 4px 0 0;
}

#clean .toki {
	position: relative;
}

#clean .toki .text {
	position: absolute;
	top: 30px;
	right: 0;
	width: calc( 100% - 140px);
	background-color: #eeeeee;
	z-index: -1;
	padding: 40px 70px 100px 160px;
}

#clean .toki .text .sub {
	display: inline-block;
	background-color: #FFF;
	padding: 0 8px;
}

#clean .toki .text .tit {
font-size: 48px;
font-weight: bold;
color: #003567;
line-height: 1.6;
margin: 0 0 24px;
}

#clean .pamphlet {
	background-color: #00A0E9;
	color: #FFF;
	font-size: 24px;
	text-align: center;
	margin: 100px 0 0;
	padding: 40px 0 30px;
	font-weight: bold;
}

#clean .pamphlet .btn01 {
	width: 280px;
	margin: 20px auto 0;
}

#clean .pamphlet .btn01 a {
	width: 280px;
	font-weight: normal;
}

#clean .top06:before {
	background: url(../image/illust-05.png);
	width: 318px;
	height: 128px;
	right: 70px;
}



/*------------------------------------------------------------------------------------------------
  exterior
--------------------------------------------------------------------------------------------------*/
#exterior {
	position: relative;
	overflow: hidden;
}

#exterior:before {
	position: absolute;
	background: url(../image/exterior-02.png) no-repeat 0 0;
	width: 733px;
	height: 316px;
	content: "";
	top: 0;
	left: calc( 50% - 30px);
}

#exterior .title {
	display: flex;
	justify-content: center;
	position: relative;
	margin-bottom: 50px;
}

#exterior .title:before {
	position: absolute;
	top: 0;
	left: 0;
	width: calc( 50% - 30px);
	height: 100%;
	background-color: #6a3906;
	content: "";
	z-index: -1;
}

#exterior .title:after {
	position: absolute;
	top: 2px;
	left: calc( 50% - 608px);
	width: 938px;
	height: 174px;
	content: "";
	background: url(../image/exterior-01.png);
}

#exterior .title .lc {
	width: 610px;
	padding: 190px 0 0;
}

#exterior .title .lc h2 {
	font-size: 60px;
	color: #FFF;
	line-height: 1.2;
	font-weight: bold;
 font-feature-settings: "palt";
	margin-left: -30px;
}

#exterior .title .lc h2 span {
	font-size: 18px;
	display: block;
	margin: 70px 0 80px;
}

#exterior .title .rc {
	width: 520px;
	line-height: 2.2;
	padding: 340px 0 0;
}

#exterior .title .rc .text {
	margin: 10px 0 0 0;
}

#exterior .top06:before {
	background: url(../image/illust-05.png);
	width: 318px;
	height: 128px;
	right: 70px;
}

#exterior .ext01 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
	position: relative;
	z-index: 10;
}

#exterior .ext01 h2 span {
	position: relative;
	display: inline-block;
}

#exterior .ext01 h2 span:before {
	position: absolute;
	bottom: 12px;
	left: 0;
	content: "";
	background-color: #f39700;
	width: 100%;
	height: 23px;
	z-index: -1;
}

#exterior .ext01 .ext02 {
	display: flex;
	margin: 0 0 30px;
}

#exterior .ext01 .ext02 .photo {
	margin-right: 24px;
}

#exterior .ext01 .ext02 .text h3 {
	position: relative;
	z-index: 10;
	font-size: 30px;
	font-weight: bold;
	color: #005982;
	line-height: 1.2;
}

#exterior .ext01 .ext02 .text h3 span {
	position: relative;
	display: inline-block;
}

#exterior .ext01 .ext02 .text h3 span:before {
	position: absolute;
	bottom: 2px;
	left: 0;
	content: "";
	background-color: #f39700;
	width: 100%;
	height: 12px;
	z-index: -1;
}

#exterior .ext01 .ext02 .text p {
	margin: 20px 0 0;
	line-height: 2;
}

#exterior .ext01 .reasonLead {
	font-size: 30px;
	font-weight: bold;
	color: #005982;
}

#exterior .ext01 .top03 {
	padding: 50px 0 0;
	width: 100%;
}

#exterior .ext01 .top03 .reason .box .num {
	top: -60px;
}

#exterior .ext01 .top03 .reason .box .cont {
	padding-top: 40px;
}

#exterior .ext03 {
	margin-bottom: -30px;
}

#exterior .ext03 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
	position: relative;
	z-index: 10;
}

#exterior .ext03 .goodsList ul li {
	margin-right: 21px;
}

#exterior .ext03 .goodsList ul li:nth-child(5n) {
	margin-right: 0;
}


.color03 {
	background-color: #000;
}

#exterior .ext04 .tit {
 display: inline-block;
	border-bottom: 3px solid #FFF;
	color: #FFF;
}

#exterior .ext04 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #FFF;
}

#exterior .ext04 ul {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
	flex-wrap: wrap;
}

#exterior .ext04 ul li {
	margin: 0 20px 20px 0;
	padding: 0;
}

#exterior .ext04 ul li:nth-child(4n) {
	margin: 0 0 20px;
}

#exterior .ext05 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 30px;
}

#exterior .ext05 .box {
	display: flex;
	justify-content: space-between;
}

#exterior .ext05 .box .text {
	width: 500px;
}

.color04 {
	background-color: #6a3906;
}

#exterior .ext06 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #FFF;
	margin: 0 0 20px;
}

#exterior .ext06 {
	color: #FFF;
}

#exterior .ext06 .box {
	display: flex;
	justify-content: space-between;
}

#exterior .ext06 .box .text {
	width: 580px;
}

#exterior .ext06 .box .text dt {
	font-size: 24px;
	margin: 0 0 20px;
}

#exterior .ext06 .box .photo li {
	margin-right: 45px;
}

#exterior .ext06 .box .photo li:nth-child(2n) {
	margin-right: 0;
}

.color05 {
	background-color: #EEE;
}

#exterior .color05 {
	margin-bottom: 40px;
}

#exterior .ext07 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
}

#exterior .ext07 .box {
	display: flex;
}

#exterior .ext07 .box .photo {
	width: 400px;
	margin-right: 128px;
}

#exterior .ext07 .box .text dl {
	display: flex;
	align-items: end;
	margin: 35px 0 0;
}

#exterior .ext07 .box .text dl dt {
	margin-right: 10px;
}

#exterior .exrm {
	margin-top: -40px;
	margin-bottom: 20px;
	position: relative;
}

#exterior .exrm:before {
	position: absolute;
	top: 0;
	left: 0;
	width: calc( 50% - 30px);
	height: 100%;
	content: "";
	background: url(../image/exterior-19.jpg) no-repeat center center;
	background-size: cover;
}
	
#exterior .exrm .text {
	position: relative;
	top: 0;
	left: 50%;
	width: 560px;
	padding: 56px 0 30px;
}

#exterior .exrm .text h2 {
	font-size: 48px;
	font-weight: bold;
	color: #003567;
}

#exterior .exrm .text p {
	line-height: 2.2;
	margin: 0 0 20px;
}



/*------------------------------------------------------------------------------------------------
  recruit
--------------------------------------------------------------------------------------------------*/
#recruit {
    position: relative;
    overflow: hidden;
}

#recruit::before {
    position: absolute;
    content: "";
    background-image: url(https://sanyo-k.biz/wp-content/uploads/recruit-banner.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 733px;
    /* width: calc(100%/2 + 60px); */
    height: 520px;
    top: 0;
    left: calc(50% - 30px);
}

#recruit .title {
	display: flex;
	justify-content: center;
	position: relative;
}

#recruit .title:before {
	position: absolute;
	top: 0;
	left: 0;
	width: calc( 50% - 30px);
	height: 100%;
	background-color: #a40035;
	content: "";
	z-index: -1;
}

#recruit .title .lc {
	width: 550px;
	padding: 80px 0 0;
}

#recruit .title .lc h2 {
	font-size: 72px;
	color: #FFF;
	line-height: 1.2;
	font-weight: bold;
}

#recruit .title .lc h2 span {
	font-size: 48px;
	display: block;
}

#recruit .title .rc {
	width: 550px;
    height: 520px;
	margin-left: 30px;
	padding: 130px 0 90px;
	line-height: 2.2;
}

#recruit .title .rc .sig {
	font-size: 24px;
	text-align: right;
	margin-bottom: 8px;
	margin-top: 30px;
}

#recruit .title .rc .sig span {
	font-size: 18px;
	margin-right: 20px;
}

#recruit .rec01 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
}

#recruit .rec01 .box {
	display: flex;
	margin: 0 0 50px;
}

#recruit .rec01 .box .photo {
	width: 460px;
	margin-right: 60px;
}

#recruit .rec01 .box .text {
	width: 470px;
	margin:14px 0 0;
}

#recruit .rec01 .box .text h3 {
	display: inline-block;
	font-size: 24px;
	font-weight: bold;
	background-color: #f39800;
	color: #FFF;
	line-height: 1.6;
	padding: 2px 8px 0;
	margin: 0 0 20px;
}

#recruit .rec01 .box .text dt {
	font-weight: bold;
	font-size: 24px;
	margin: 0 0 10px;
}

#recruit .rec01 .box .text dd {
	line-height: 2;
}

.second .cont03 {
	width: 1220px;
	margin: 0 auto;
	padding: 100px 0;
}

.color06 {
	background-color: #f39700;
}

#recruit .rec02 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #FFF;
	margin: 0 0 20px;
}

#recruit .rec02 ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	justify-content: space-between;
}

#recruit .rec02 ul li {
	margin: 0;
	padding: 0;
	text-align: center;
}

#recruit .rec02 ul li img {
	display: block;
	margin: 0 0 16px;
}

#recruit .rec03 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
}

#recruit .rec03 .btn {
	display: flex;
	margin: 0 0 30px 250px;
	padding: 0;
	list-style: none;
}

#recruit .rec03 .btn li {
	margin: 0 20px 0 0;
	padding: 6px 50px 4px 20px;
	background-color: #D0121B;
	color: #FFF;
	border: 1px solid #D0121B;
	border-radius: 20px;
	position: relative;
	cursor: pointer;
}

#recruit .rec03 .btn li:before {
	position: absolute;
	top: center;
	right: 10px;
	content: "＞";
}

#recruit .rec03 .btn li.now {
	background-color: #FFF;
	color: #000;
	border: 1px solid #CCC;
}

#recruit .rec03 .recinfo.nodisplay {
	display: none;
}

#recruit .rec03 .recinfo table {
	width: 1100px;
	margin: 0 auto;
	border-bottom: 1px solid #000;
}

#recruit .rec03 .recinfo table th {
	text-align: left;
	font-weight: normal;
	width: 210px;
	padding: 24px 0;
	border-top: 1px solid #000;
	vertical-align: top;
}

#recruit .rec03 .recinfo table td {
	border-top: 1px solid #000;
	padding: 24px 0;
}

#recruit .rec04 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #003567;
	margin: 0 0 20px;
}

#recruit .rec04 .recFlow {
	display: flex;
	justify-content: space-between;
}

#recruit .rec04 .recFlow div {
	position: relative;
	padding-right: 29px;
}

#recruit .rec04 .recFlow div.last {
	padding-right: 0;
}

#recruit .rec04 .recFlow div:before {
	position: absolute;
	content: "";
	background: url(../image/recruit-13.png) no-repeat 0 0;
	top: 80px;
	right: 0;
	width: 29px;
	height: 33px;
}

#recruit .rec04 .recFlow div.last:before {
	display: none;
}

#recruit .rec05 {
	padding: 60px 0 120px;
	text-align: center;
	position: relative;
}

#recruit .rec05:before {
	position: absolute;
	background: url(../image/recruit-15.png);
	width: 136px;
	height: 248px;
	top: 100px;
	left: calc( 50% + 240px);
	content: "";
}

#recruit .rec05 h2 {
 font-size: 48px;
	font-weight: bold;
	color: #f39800;
	margin: 0 0 20px;
}

#recruit .rec05 .number {
	margin: 30px 0 20px;
}

.greeting-inner {
    display: flex;
    flex-wrap: wrap;
    column-gap: 54px;
    row-gap: 30px;
    align-items: flex-start;
}

.greeting-inner .__img {
    width: 370px;
}

.greeting-inner .__txt {
    flex: 1;
}

.greeting-inner .__txt p {
    line-height: 2.1;
}

.manager-name {
    text-align: right;
    font-size: 18px;
}

.manager-name span {
    font-size: 24px;
    display: inline-block;
    padding-left: 18px;
}

.company-video {
    position: absolute;
    content: "";
    width: 733px;
    /* width: calc(100% / 2 + 60px); */
    height: 520px;
    top: 0;
    left: calc(50% - 30px);
}

.company-video video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

video.video-sp {
	width: 100%;
}

#company::before {
	content: none;
}

.recBox .cont:after {
	content: none;
	background-image: none;
}

.recBox .cont .cont-img {
	position: absolute;
	width: 100%;
	height: auto;
	left: 48%;
	transform: translateX(-50%);
	bottom: 0;
	max-width: 930px;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

.recBox .cont .cont-img .__img img {
	object-fit: cover;
}