@charset "UTF-8";

.mile22_content a[target="_blank"]{
  padding-right: 0;
  background-image: none;
}

.mile22_content {
  width: 663px;
  margin: 0 auto 20px;
  color: #555;
}
@media only screen and (max-width: 768px) {
  .mile22_content {
    max-width: 100%;
  }
}

.mile22_content * {
  box-sizing: border-box;
}

.mile22_content a:hover img {
  opacity: .8;
}

.mile22_content {
  margin-bottom: 20px;
  color: #555;
}

.mile22_mainbox-1 {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border: 1px solid #808080;
  background-color: #f0f0f0;
  background: linear-gradient(to bottom, #fff 70%, #b4b8c1 80%);
}

.mile22_mainbox-1 .mile22_maininner-1 {
  padding: 0 10px 30px;
}
@media only screen and (max-width: 768px) {
	.mile22_mainbox-1 .mile22_maininner-1 {
		padding: 0 10px 10px;
	}
}

.mile22_mainbox-1 .mile22_maininner-1.backImg {
  position: relative;
  height: 678px;
  background: url('/event/mile22/images/bg_01.png') no-repeat center top;
}
@media only screen and (max-width: 768px) {
  .mile22_mainbox-1 .mile22_maininner-1.backImg {
		width: 97%;
		height: auto;
		margin: auto;
    background-size: 100%;
		background-color: black;
  }
}

.mile22_boxinner.backImg_contents {
  position: absolute;
  bottom: 0;
  width: 641px;
  padding: 0 20px;
  color: #fff;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner.backImg_contents {
		position: static;
		width: 94%;
		padding: 68% 0 0;
		margin: auto;
	}
}

.mile22_mainbox-1 .mile22_maininner-1 h3 {
  margin-bottom: 10px;
  text-align: center;
}
@media only screen and (max-width: 768px) {
	.mile22_mainbox-1 .mile22_maininner-1 h3 {
		font-size: 14px;
	}
}

.mile22_mainbox-1 .mile22_maininner-1 h4 {
  margin-bottom: 10px;
  font-size: 16px;
  text-align: center;
}
@media only screen and (max-width: 768px) {
	.mile22_mainbox-1 .mile22_maininner-1 h4 {
		font-size: 14px;
	}
}

.mile22_mainbox-1 .mile22_maininner-1 p {
  margin-bottom: 20px;
  line-height: 1.8;
  letter-spacing: 1px;
}
@media only screen and (max-width: 768px) {
	.mile22_mainbox-1 .mile22_maininner-1 p {
		margin-bottom: 15px;
		line-height: 1.5;
		letter-spacing: 1px;
	}
}

.mile22_mainbox-2 {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border: 1px solid #808080;
  background-color: #fff;
  background: url('/event/mile22/images/bg_03.png') no-repeat center bottom;
}
@media only screen and (max-width: 768px) {
  .mile22_mainbox-2 {
    background-size: 100%;
  }
}

.mile22_mainbox-2 h3 {
  margin: 0;
}

.mile22_mainbox-2 .mile22_maininner-2 {
  width: 641px;
  margin: -40px auto 0;
  padding: 20px 20px 30px;
  position: relative;
}
@media only screen and (max-width: 768px) {
	.mile22_mainbox-2 .mile22_maininner-2 {
		width: 100%;
	}
}

.mile22_maininner-2_Box {
  position: relative;
  margin: -276px 10px 0;
  padding: 20px;
  background: rgba(255, 255, 255, .75);
}
@media only screen and (max-width: 768px) {
	.mile22_maininner-2_Box {
		margin: -45% 10px 0;
		padding: 14px;
	}
}

.mile22_maininner-2_Box_Img {
  position: absolute;
  right: -10px;
  bottom: -20px;
}
@media only screen and (max-width: 768px) {
	.mile22_maininner-2_Box_Img {
		right: -10px;
		top: 18.5rem;
		text-align: right;
	}
}
@media only screen and (max-width: 560px) {
	.mile22_maininner-2_Box_Img {
		right: -10px;
		top: 24rem;
		text-align: right;
	}
	.mile22_maininner-2_Box_Img img {
		width: 70%;
	}
}
@media only screen and (max-width: 480px) {
	.mile22_maininner-2_Box_Img {
		right: -10px;
		top: 27rem;
		text-align: right;
	}
	.mile22_maininner-2_Box_Img img {
		width: 65%;
	}
}

.mile22_maininner-2_Box p {
  color: #555;
}
@media only screen and (max-width: 480px) {
	.mile22_maininner-2_Box p {
		font-size: 10px;
	}
}


.mile22_maininner-2_Box h4 {
  margin: 50px 0 15px;
  text-align: center;
}
@media only screen and (max-width: 768px) {
	.mile22_maininner-2_Box h4 {
		margin: 20px 0 10px;
		text-align: center;
	}
}

.mile22-Box_col2-Text1 {
  margin-right: 272px;
  margin-bottom: 45px;
}
@media only screen and (max-width: 768px) {
	.mile22-Box_col2-Text1 {
		margin-right: 0;
		margin-bottom: 20px;
	}
}

.mile22-Box_col2-Text2 {
  margin: -50px 372px 25px 0;
}
@media only screen and (max-width: 768px) {
	.mile22-Box_col2-Text2 {
		margin: -10px 55% 15px 0;
	}
}

.mile22-Box_col2-Text3 {
  margin-right: 272px;
  margin-bottom: 45px;
}
@media only screen and (max-width: 768px) {
	.mile22-Box_col2-Text3 {
		margin: 0 55% 15px 0;
	}
}

.mile22-Box_col2-Text1_Img {
  margin: 45px 0 20px;
}
@media only screen and (max-width: 768px) {
	.mile22-Box_col2-Text1_Img {
		margin: 0;
	}
	.mile22-Box_col2-Text1_Img img {
		width: 65%;
	}
}

.mile22_boxinner {
  margin-bottom: 40px;
}

@media only screen and (max-width: 768px) {
	.mile22_boxinner {
		padding: 18px;
	}
}

.mile22_boxinner .mile22_boxinner_box {
  position: relative;
  margin: 0 auto 20px;
  padding: 25px 20px;
  background-color: #e5e5e5;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner .mile22_boxinner_box {
		padding: 18px;
	}
}

.mile22_boxinner_Col2 {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner_Col2 {
		display: block;
	}
}

.mile22_boxinner_Col2-Box h4 {
  text-align: right;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner_Col2-Box h4 {
		text-align: left;
	}
	.mile22_boxinner_Col2-Box h4 img {
		width: 50%;
	}
}

.mile22_boxinner_Col2 p {
  color: #555;
}

.mile22_boxinner_Col2-text1 {
	width: 258px;
	margin: 0 0 30px 30px;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner_Col2-text1 {
		width: 100%;
		margin: 0 0 20px 0;
	}
}

.mile22_boxinner .mile22_boxinner_box p {
  margin-bottom: 0;
}

.mile22_boxinner_box_mv {
  padding-bottom: 10px;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner_box_mv img {
		width: 100%;
	}
	.mile22_boxinner_box_mv.mv01 {
		width: 64.7%;
		float: left;
	}
	.mile22_boxinner_box_mv.mv02 {
		width: 35.3%;
		float: right;
	}
}

.mile22_boxinner .mile22_boxinner_box .mile22_boxinner_box_mv img {
  width: 100%;
}

.mile22_boxinner .mile22_boxinner_box>img {
  position: absolute;
  bottom: 4%;
  right: 11px;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner .mile22_boxinner_box>img {
		position: static;
		margin: 10px 0;
	}
}

.mile22_boxinner .mile22_boxinner_box .item-img-2 {
  bottom: 6%;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner .mile22_boxinner_box .item-img-2 {
		position: static;
	}
}

.mile22_boxinner .mile22_boxinner_box .item-img-3 {
  top: 5%;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner .mile22_boxinner_box .item-img-3 {
		position: static;
	}
}

.mile22_boxinner .mile22_boxinner_box .item-img-4 {
  bottom: 15%;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner .mile22_boxinner_box .item-img-4 {
		position: static;
	}
}

.mile22_boxinner .mile22_boxinner_box .mile22_boxinner_box_text01 {
  margin: 10px 357px 0 0;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner .mile22_boxinner_box .mile22_boxinner_box_text01 {
		margin: 0;
	}
}

.mile22_boxinner .mile22_boxinner_box .mile22_boxinner_box_text02 {
  position: relative;
  margin: 100px 82px 0 0;
  vertical-align: bottom;
  z-index: 10;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner .mile22_boxinner_box .mile22_boxinner_box_text02 {
		margin: 0;
	}
}

.mile22_boxinner .mile22_boxinner_box .mile22_boxinner_box_text03 {
  margin: 54px 82px 0 0;
  vertical-align: bottom;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner .mile22_boxinner_box .mile22_boxinner_box_text03 {
		margin: 0;
	}
}

.mile22_boxinner .mile22_boxinner_box .mile22_boxinner_box_text04 {
  margin: 10px 300px 0 0;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner .mile22_boxinner_box .mile22_boxinner_box_text04 {
		margin: 0;
	}
}

.mile22_boxinner_box.--sub01 {
  width: 313px;
  height: 204px;
  padding: 10px 20px 20px;
}
@media only screen and (max-width: 768px) {
	.mile22_boxinner_box.--sub01 {
		width: 100%;
		height: auto;
		padding: 10px 20px 20px;
	}
}

.mile22_databox {
  position: relative;
  margin: 40px 0;
  border: 5px solid #c00000;
}

.mile22_databox h3 {
  margin: 8px 0 0 128px;
}

.mile22_databox>img {
  position: absolute;
  top: 0;
  left: 0;
}

.mile22_databox .mile22_dataoxInner {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin: 0 25px;
}
@media only screen and (max-width: 768px) {
	.mile22_databox .mile22_dataoxInner {
		display: block;
		margin: 0 15px;
	}
}

.mile22_databox .mile22_dataoxInner .mile22_databoxText {
  margin-top: 20px;
}

.mile22_databox .mile22_dataoxInner .mile22_databoxText h4 {
  color: #e60012;
  font-size: 14px;
  margin-bottom: 10px;
}

.mile22_databox .mile22_dataoxInner .mile22_databoxText p {
  margin-top: 10px;
  margin-bottom: 0;
}

.mile22_databox .mile22_dataoxInner .mile22_databoxText small {
  font-size: 10px;
}

.mile22_databox_Img {
  margin: -27px 0 25px;
}
@media only screen and (max-width: 768px) {
	.mile22_databox_Img {
		margin: 10px 0 15px;
	}
	.mile22_databox_Img img {
		width: 100%;
	}
}

.mile22_boxinner_mt70 {
  margin-top: 70px;
}