@charset "UTF-8";
/* CSS Document */

.bgWH {background-color: #FFF;}
.bgRD {background-color: #E4002B;}
.bgOR {background-color: #FF8216;}
.bgGR {background-color: #00874B;}
.txtWH {color: #FFF;}
.txtRD {color: #E4002B;}
.txtOR {color: #FF8216;}
.txtGR {color: #00874B;}
.txtYL {color: #FAE921;}

main {position: relative;}
main::after {position: absolute; content: ''; max-width: 1380px; height: 100%; margin: 0 auto; top: 0; left: 0; right: 0; background-image: url("../img/bg_side.png"),url("../img/bg_side.png"); background-repeat: repeat-y,repeat-y; background-position: right top,left top;}
.container {width: 100%; max-width: 1232px; padding-left: 0; padding-right: 0;}
.containers {width: calc(100% - 40px); max-width: 888px; padding-left: 0; padding-right: 0;}
.mlr,.container,.containers {margin-left: auto; margin-right: auto;}
.mlr20,.col1,.col2,.col3,.col4,.col5,.col6 {margin-left: 20px; margin-right: 20px;}
.col1 {width: calc(16.6666% - 40px);}
.col2 {width: calc(33.3333% - 40px);}
.col3 {width: calc(50% - 40px);}
.col4 {width: calc(66.6666% - 40px);}
.col5 {width: calc(83.3333% - 40px);}
.col6 {width: calc(100% - 40px);}
.full {width: 100%;}
.half {width: 50%;}
.spOnly {display: none;}
@media screen and (max-width: 1392px) {
	main::after {background-position: right 10px top,left 10px top;}
}
@media screen and (max-width: 896px) {
	main::after {background-image: url("../img/bg_side_sp.png"),url("../img/bg_side_sp.png");}
  .containers {width: calc(100% - 30px);}
  .mlr20,.col1,.col2,.col3,.col4,.col5,.col6 {margin-left: 15px; margin-right: 15px;}
  .col1 {width: calc(16.6666% - 30px);}
  .col2 {width: calc(33.3333% - 30px);}
  .col3 {width: calc(50% - 30px);}
  .col4 {width: calc(66.6666% - 30px);}
  .col5 {width: calc(83.3333% - 30px);}
  .col6 {width: calc(100% - 30px);}
	.pcOnly {display: none;}
	.spOnly {display: block;}
}
@media screen and (max-width: 568px) {
  .col1 {width: calc(33.3333% - 30px);}
  .col2,.col3,.col4,.col5,.col6 {width: calc(100% - 30px);}
}

ul.dot {list-style: disc; margin-left: 1.5em;}
ul.num {list-style: decimal; margin-left: 1.5em;}

.z1 {position: relative; z-index: 1;}
.btnCmn {max-width: 615px; width: 100%; margin-left: auto; margin-right: auto;}
.btnCmn a {display: block; width: 100%; padding: 20px; background: #E4002B; border: 5px solid #FFF; box-shadow: 5px 5px 5px rgba(0,0,0,.3); position: relative;}
.btnCmn a span {width: 315px; display: block; margin: 0 auto;}
.btnCmn a span img {width: 100%;}
.btnCmn a::before {position: absolute; content: ''; width: 0; height: 0; border-style: solid; border-color: transparent transparent transparent #fff; border-width: 13px 0px 13px 22px; top: 50%; transform: translateY(-50%); right: 20px;}
.btnCmn a:hover {transform: scale(1.1);}
@media screen and (max-width: 896px) {
	.btnCmn a {border: 3px solid #FFF; padding: 10px;}
	.btnCmn a span {width: 186px;}
	.btnCmn a::before {border-width: 7px 0px 7px 12px; right: 10px;}
}

.head h1 {position: relative; z-index: 1; max-width: 1125px; width: 80%; padding: 45px 0; margin: 0 auto; font-size: 0;}
.head h1 img {width: 100%;}
.head .half {position: absolute; width: 50%; height: 100%; top: 0;}
.head .half.bgRD {left: 0; background-image: url("../img/01-01.png"),url("../img/01-01.png"); background-repeat: repeat-x,repeat-x; background-position: top 20px right, bottom 20px right;}
.head .half.bgOR {right: 0; background-image: url("../img/01-02.png"),url("../img/01-02.png"); background-repeat: repeat-x,repeat-x; background-position: top 20px left, bottom 20px left;}
header .makerLogo {padding: 25px 0;}
.makerLogo li img {width: 100%;}
.makerLogo li:first-child {width: 435px; margin-right: 65px; position: relative;}
.makerLogo li:nth-child(2) {width: 115px;}
.makerLogo li:last-child {width: 295px; margin-left: 65px;}
@media screen and (max-width: 1024px) {
	.makerLogo li:first-child {width: 36.2%; margin-right: 4.8%;}
	.makerLogo li:nth-child(2) {width: 9%;}
	.makerLogo li:last-child {width: 24.6%; margin-left: 4.8%;}
}
@media screen and (max-width: 896px) {
	.head h1 {padding: 22px 0;}
	.head .half.bgRD,.head .half.bgOR {background-size: auto 7.5px;}
	.head .half.bgRD {background-position: top 6.5px right, bottom 6.5px right;}
	.head .half.bgOR {background-position: top 6.5px left, bottom 6.5px left;}
}

#top01 .mainImg {background: #E2E900;}
#top01 .campLogo {position: absolute; width: 100%; padding: 0 8%; top: 50%; transform: translateY(-50%);}
#top01 .campLogo img {width: 100%;}
#top01 .copy .container {padding: 40px 40px 10px; position: relative; z-index: 2;}
#top01 .copy::after {position: absolute; content: ''; width: 100%; height: 100%; border-top: 15px solid #E2E900; border-bottom: 15px solid #E2E900; background-color: #E4002B; top: 0; z-index: -1;}
#top01 .subImg {margin-top: 0; background: #FFF566; position: relative; z-index: 1;}
#top01 .subImg .circleImg01,#top01 .subImg .circleImg02 {position: absolute;}
#top01 .subImg .circleImg01 {width: 27%; top: -20%; right: -15px;}
#top01 .subImg .circleImg02 {width: 27%; bottom: 17%; left: 10px;}
#top01 .subImg .inner {padding: 0 6px; margin-top: auto;}
@media screen and (max-width: 896px) {
	#top01 .campLogo {padding: 0 2px;}
	#top01 .copy .container {padding: 35px 20px 35px;}
	#top01 .subImg .circleImg01 {width: 33%; right: -10px;}
	#top01 .subImg .circleImg02 {width: 33%; bottom: 0; left: 5px}
	#top01 .subImg .inner {overflow: hidden;}
	#top01 .subImg .inner img {max-width: none; width: 114%; margin-left: -7%;}
}

#campDetail {background: #00874B;}
#campDetail .container {max-width: 1040px;}
#campDetail h2 {border-top: 3px solid #FFF; border-bottom: 3px solid #FFF; padding: 15px 0;}
#campDetail h2 .small {font-size: 80%;}
#campDetail .half .txt20.txtWH {margin-left: 1.5em;}
#campDetail dl {padding: 10px;}
@media screen and (max-width: 1090px) {
	#campDetail .container {padding-left: 30px; padding-right: 30px;}
	#campDetail .col6 {justify-content: space-between;}
	#campDetail h2 .txt22 {display: block;}
	#campDetail .half {width: calc(50% - 10px);}
	#campDetail .spbr {display: block;}
	#campDetail dl {align-items: center;}
}
@media screen and (max-width: 896px) {
	#campDetail .container {padding-left: 15px; padding-right: 15px;}
	#campDetail h3.txt28 {margin-bottom: 5px;}
	#campDetail .half .txt20.txtWH {margin-left: 1em;}
}
@media screen and (max-width: 568px) {
	#campDetail h2 {padding: 5px 0;}
	#campDetail .half {width: 100%;}
	#campDetail .half:first-of-type {margin-bottom: 20px;}
	#campDetail dl {padding: 5px 10px;}
}

#top02 {background-color: #FFF566; background-image: url("../img/line.svg"); background-repeat: repeat-x; background-size: auto 9px; background-position: bottom center;}
#top02 .ttlImg {width: 195px; margin: 0 auto; position: relative; z-index: 1;}
#top02 .ttlImg img {width: 100%;}
#top02 .col3 {/*display: flex; flex-direction: column;*/}
#top02 .inner {/*display: flex; flex-direction: column; flex-grow: 1;*/}
#top02 .itemTtl {background: #FFF; border: 5px solid #E4002B; border-bottom: none; margin-top: -47px; padding: 70px 25px 20px;}
#top02 .itemTtl.bdrOR {border-color: #FF8216;}
#top02 .col3:last-of-type .inner {border-color: #FF8216;}
#top02 .col3.itemImg {padding: 0 5% 20px; background: #FFF; }
#top02 .col3.itemNum {padding: 0 25px 20px; background: #FFF; }
#top02 .itemNum img {width: 100%;}
#top02 .makerLogo li:first-child {width: 40%; margin-right: 5%;}
#top02 .makerLogo li:nth-child(2) {width: 10%;}
#top02 .makerLogo li:last-child {width: 28%; margin-left: 5%;}
#top02 dl.col3 {padding: 15px 20px 15px 10px;}
#top02 .col3 dd a {display: block; background: #FFF; border: 1px solid #FFF; padding: 5px 25px 5px 10px; position: relative;}
#top02 .col3 dd a:hover {background: #E4002B; color: #FFF;}
#top02 .col3:last-of-type dd a:hover {background: #FF8216; color: #FFF;}
#top02 .col3 dd a::before {position: absolute; content: ''; width: 0; height: 0; border-style: solid; border-color: transparent transparent transparent #E4002B; border-width: 8.5px 0px 8.5px 14px; top: 50%; transform: translateY(-50%); right: 5px;}
#top02 .col3:last-of-type dd a::before {border-color: transparent transparent transparent #FF8216;}
#top02 .col3 dd a:hover::before {border-color: transparent transparent transparent #FFF;}
#top02 .col3.txt22 {padding: 20px 25px 20px; background: #FFF;}
#top02 .col3.logo {padding: 0 25px 20px; background: #FFF; display: flex; flex-direction: column; justify-content: center; align-items: center;}
#top02 .col3.logo .inner {width: 305px;}
#top02 .col3.subImg {background: #FFF; border: 5px solid #E4002B; border-top: none; padding: 0 25px 20px;}
#top02 .col3.subImg.bdrOR {border-color: #FF8216;}
#top02 .subImg li {width: calc(50% - 10px);}
#top02 .col3.itemImg,#top02 .col3.itemNum,#top02 .col3.txt22,#top02 .col3.logo {border-left: 5px solid #E4002B; border-right: 5px solid #E4002B;}
#top02 .col3.itemImg.bdrOR,#top02 .col3.itemNum.bdrOR,#top02 .col3.txt22.bdrOR,#top02 .col3.logo.bdrOR {border-color: #FF8216;}
@media screen and (max-width: 1280px) {
	#top02 .col3 dt {width: 100%;}
	#top02 .col3 dd {margin-left: auto;}
}
@media screen and (max-width: 1160px) {
	#top02 .itemTtl {padding: 70px 15px 20px;}
}
@media screen and (max-width: 896px) {
	#top02 {background-size: auto 3px;}
	#top02 .pcOnly {display: flex;}
	#top02 .spOnly {display: none;}
	#top02 .ttlImg {width: 120px;}
	#top02 .itemTtl {margin-top: -30px; padding: 50px 15px 15px;}
	#top02 .col3.itemNum,#top02 .col3.logo,#top02 .col3.subImg {padding: 0 15px 15px;}
	#top02 .col3.txt22 {padding: 15px;}
	#top02 .col3.logo .inner {width: 158px;}
	#top02 .col3.logo:nth-child(2) .inner {width: 120px;}
	#top02 .txtRight {font-size: 14px;}
}
@media screen and (max-width: 568px) {
	#top02 .pcOnly {display: none;}
	#top02 .spOnly {display: block;}
	#top02 .inner {margin-top: -29px; padding: 40px 20px 15px; border: 3px solid #E4002B; background: #FFF;}
	#top02 .col3 {margin-bottom: 10px;}
	#top02 .col3 dl {margin-left: -20px; margin-right: -20px; padding: 10px 10px 10px 5px;}
	#top02 .col3 dt {width: auto; font-size: 20px;}
	#top02 .col3 dd a {padding: 4px 15px 4px 7px; font-size: 11px!important;}
	#top02 .col3 dd a::before {border-width: 5px 0px 5px 8px; right: 4px;}
	#top02 .col3 .logo {width: 158px; margin-left: auto; margin-right: auto;}
	#top02 .col3 .logo:nth-child(2) {width: 120px; margin-left: auto; margin-right: auto;}
	#top02 .subImg li {width: calc(50% - 6px);}
}

#top03 .ttlImg {max-width: 750px; width: 76.5%; margin-left: auto; margin-right: auto;}
#top03 .ttlImg img {width: 100%;}
#top03 .col3 {box-shadow: 5px 5px 5px rgba(0,0,0,.3);}
@media screen and (max-width: 568px) {
	#top03 .col3 {margin-bottom: 15px;}
	#top03 .col3:last-of-type {margin-bottom: 0;}
}

#top04 {background-color: #E1EEDB; background-image: url("../img/line.svg"); background-repeat: repeat-x; background-size: auto 9px; background-position: top center;}
#top04 .col6 {background: #D2DC39; padding-bottom: 60px;}
#top04 h2,#top05 h2 {padding: 10px;}
#top04 .inner {width: calc(100% - 200px); margin: 60px auto 0; padding: 80px 50px; background-image: url("../img/04-01.svg"),url("../img/04-02.svg"),url("../img/04-03.svg"),url("../img/04-04.svg"); background-repeat: no-repeat; background-position: left 15px top 15px,right 15px top 15px,left 15px bottom 15px,right 15px bottom 15px; background-size: 22px auto;}
#top04 dt {width: 148px; background: #000; color: #FFF; padding: 5px; text-align: center;}
#top04 dd {width: calc(100% - 148px); padding-left: 20px;}
#top04 dd:not(:last-child) {margin-bottom: 30px;}
#top04 dd ul li {list-style: square; margin-left: 1em; margin-right: 1em;}
#top04 dd ul li a:hover {text-decoration: underline;}
@media screen and (max-width: 1280px) {
	#top04 .inner {width: calc(100% - 120px);}
}
@media screen and (max-width: 896px) {
	#top04 {background-size: auto 3px;}
	#top04 .col6 {padding-bottom: 30px;}
	#top04 .inner {width: calc(100% - 30px); margin: 30px auto 0; padding: 20px 15px; background-position: left 4px top 4px,right 4px top 4px,left 4px bottom 4px,right 4px bottom 4px; background-size: 8px auto;}
	#top04 .inner dl,#top04 .inner .txt24 {font-size: 16px;}
	#top04 dt {width: 90px;}
	#top04 dd {width: calc(100% - 110px); padding-left: 20px;}	
}
@media screen and (max-width: 568px) {
	#top04 .inner dl,#top04 .inner .txt24 {font-size: 12px;}
	#top04 dt {width: 60px;}
	#top04 dd {width: calc(100% - 70px); padding-left: 15px;}
}

#top05 {background: #E2E900;}
#top05 .inner {padding: 80px 100px;}
#top05 .makerLogo li:first-child {width: 40.8%; margin-right: 6%; position: relative;}
#top05 .makerLogo li:nth-child(2) {width: 10%;}
#top05 .makerLogo li:last-child {width: 27.5%; margin-left: 6%;}
#top05 h3 span {position: relative; z-index: 1; display: inline-block;}
#top05 h3::before {position: absolute; content: ''; width: 100%; height: 3px; background: #E4002B; left: 0; top: 50%; transform: translateY(-50%);}
.txtDRD {color: #BF1027;}
#top05 h3.txtDRD::before {background: #BF1027;}
#top05 .itemImg:first-of-type {margin-top: -70px;}
@media screen and (max-width: 896px) {
	#top05 .inner {padding: 20px;}
	#top05 .itemImg:first-of-type {margin-top: -30px;}
	#top05 .inner .txt24 {font-size: 15px;}
}
@media screen and (max-width: 568px) {
	#top05 .inner .txt45 {font-size: 15px;}
	#top05 .inner .txt24 {font-size: 12px;}
}

#top06 {background: #F2EBDB;}
#top06 .num {width: 62px; margin: 0 auto; position: absolute; z-index: 1; top: -31px; left: 0; right: 0;}
#top06 .num img {width: 100%;}
#top06 .col2 {border: 3px solid #E4002B; border-radius: 10px; background: #FFF; padding: 45px 25px 25px; margin-top: 31px;}
#top06 .arrow {padding-bottom: 30px; position: relative;}
#top06 .arrow::before {position: absolute; content: ''; width: 0; height: 0; border-style: solid; border-color: #e4002b transparent transparent transparent; border-width: 14px 16px 0px 16px; left: 50%; transform: translateX(-50%); bottom: 8px;}
#top06 .notice {border: 4px solid #E4002B; padding: 30px; background: #FFF;}
#top06 .notice .inner {height: 330px; padding-right: 20px; overflow-y: auto;}
#top06 .notice .inner dt {color: #E4002B; font-weight: 600;}
#top06 .notice .inner dd:not(:last-child) {margin-bottom: 30px;}
@media screen and (max-width: 896px) {
	#top06 .txt40 {font-size: 30px;}
	#top06 .num {width: 45px; top: -22.5px;}
	#top06 .col2 {margin-top: 22.5px; padding: 30px 10px 20px; width: calc(100% - 30px); margin-bottom: 20px;}
	#top06 .col2 .txt24 {font-size: 23px;}
	#top06 .notice {border: 2px solid #E4002B; padding: 20px 15px;}
	#top06 .notice .inner {height: 280px; padding-right: 15px; font-size: 15px;}
	#top06 .notice .inner dd:not(:last-child) {margin-bottom: 20px;}
}

@media screen and (max-width: 1280px) {
	#top02 .container,#top03 .container,#top04 .container,#top05 .container,#top06 .container {padding-left: 30px; padding-right: 30px;}
}
@media screen and (max-width: 896px) {
	#top02 .container,#top03 .container,#top04 .container,#top05 .container,#top06 .container {padding-left: 15px; padding-right: 15px;}
}

footer dt {font-weight: 600;}
@media screen and (max-width: 896px) {
	footer h2 {font-size: 18px;}
	footer .txt18 {font-size: 15px;}
	footer dt {font-size: 13px;}
}



