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


@media screen and (max-width: 767px) {


.maincontents-inner .box-title h2 {
    font-size: calc(6vw * 2.2);
    margin-bottom: calc(1.5vw * 2.4);
}

.maincontents-inner .box-title h3 {
     font-size: calc(2.2vw * 2.4);
}

.maincontents-inner p {
   font-size: 14px;
}

.maincontents-inner .layout-85 {
    max-width: 88%;
}

/* contents01 */

.contents01 {
    padding: 15vw 0px;
}

.contents01::before, .contents01::after {
	width: 3%;
}

/* contents04 */

.contents04 {
    padding: 14vw 6%;
}

.contents04::before, .contents04::after {
	height: 20px;
}


/* layout01 */

.layout01 {
    width: 82%;
    max-width: 82%;
  justify-content: center;
}

.layout01 .box-detail {
	width: 100%;
}

.layout01 h2 img {
    width: 72%;
}

.layout01 h3 {
    font-size: calc(3.3vw * 2.2);
    text-indent: calc(-2vw * 2.2);
    padding: 5vw 0px;
}


/* layout02 */

.layout02 .box {
  justify-content: center;
    gap:8vw 0px;
    width: 88%;
    margin: 0px auto;
}

.layout02 .box:nth-child(even) {
    flex-direction: column;
}

.layout02 .box:not(:last-child) {
    margin-bottom: 20vw;
}

.layout02 .box-detail {
    width: 100%;
    padding: 0vw;
}

.layout02 .box:nth-child(odd) .box-detail {
    padding-left: 0%;
}

.layout02 .box:nth-child(even) .box-detail {
    padding-left: 0%;
    padding-right: 0%;
}    

.layout02 .box-detail::before {
    display: none;
}

.layout02 .box-img {
    width: 80%;
    max-width: 400px;
    margin: 0px auto;
}

.layout02 .box-img::before {
	width: 10vw;
	height: 10vw;
    margin-bottom: -5vw;
}

.layout02 .box:nth-child(odd) .box-img::before {
    margin-left: -5vw;
}

.layout02 .box:nth-child(even) .box-img::before {
    margin-right: -5vw;
}

.layout02 .box-detail h3 {
   text-indent: -2vw;
    margin-bottom: calc(3vw* 2.2);
}

.layout02 .box-detail ul {
   padding: 5vw 0px;
}

.layout02 .box-detail ul li {
   font-size: 16px;
}


/* layout03 */

.layout03 {
    padding: 6vw 8% 14vw;
}

.layout03::before {
	width: 3%;
}

.layout03 .box-text {
    width: 100%;
    padding: 4vw 3.5vw 0px;
}

.layout03 h4 {
     font-size: calc(2.5vw* 2);
}


/* layout04 */

.layout04 {
    gap:10vw 4%;
    padding-top: 0vw;
}

.layout04 .box {
	width: 48%;
}


.layout04 .box-detail, .layout04 .box-text {
	padding-top: calc(1.5vw* 3);
}

.layout04 .box-text:not(:last-child) {
	padding-bottom: calc(1.5vw* 3);
}

.layout04 h4, .layout04 h5 {
    font-size: 17px;
}

.layout04 h6 {
	font-size: 15px;
}
    
@media screen and (max-width: 500px) {
    .layout04 .box {
	width: 100%;
}
    
.layout04 h4, .layout04 h5 {
    font-size: calc(1.5vw* 3.2);
}

.layout04 h6 {
	font-size: calc(1.2vw * 3.2);
}
    
}

/* layout05 */

.layout05 {
    flex-direction: column;
    gap:10vw;
}

.layout05 .box-title-page01 {
    width: 100%;
}

.layout05 .box-detail {
    width: 100%;
}

.layout05 .box {
    padding-left: calc(8.8vw * 2.2);
}

.layout05 .box:not(:last-child) {
    padding-bottom: calc(3.2vw * 2.2);
    margin-bottom: calc(3.2vw * 2.2);
}

.layout05 .box::before {
	width: calc(7.4vw * 2.2);
	height: calc(7.5vw * 2.2);
    margin-top: calc(-1.5vw * 2.2);
}

.layout05 .box::after {
	height: calc(2vw * 2.2);
    margin-bottom: calc(-2vw * 2.2);
}

.layout05 .box:last-child::after {
    display: none;
}

.layout05 h6 {
    font-size: 16px;
    margin-bottom: calc(0.5vw * 2.2);
    text-indent: calc(-0.5vw * 2.2);
}


    .pc-view {
        display: none;
    }
    .sp-view {
         display: inline-block;
    }
   
}