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


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

/* layout01 */

.layout01 {
  justify-content: center;
    flex-direction: column;
    gap:50px;
}

.layout01 .box-img {
	width: 100%;
    max-width: 400px;
    padding-left: 15%;
}

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

.layout01 .box-name {
    margin-top: 40px;
}

.layout01 .box-name::before {
	width: 46%;
	height: 120px;
    margin-bottom: 0px;
}

.layout01 h2 {
    font-size: 18px;
    margin-bottom: 15px;
}
    
.layout01 h3 {
    font-size: 15px;
}

.layout01 h4 {
    font-size: 22px;
line-height: 1.6;
letter-spacing: 0em;
    padding: 15px 0px 30px;
}

.layout01 h6 {
    font-size: 25px;
letter-spacing: 0.4em;
    padding-top: 25px;
}

.layout01 h6::before {
    font-size: 14px;
}

/* layout02 */

.layout02 {
  justify-content: center;
    padding-left: 0%;
    gap:40px;
}

.layout02 .box-title {
    flex: auto;
    text-align: center;
}

.layout02 .box-detail {
    width: 100%;
border-width : 4px;
    border-radius: 30px;
    padding: 10px 6% 50px;
}

.layout02 table tr {
    border-bottom-style : solid;
border-color : #000000;
border-width : 1px;
}
    
.layout02 table td {
    display: block;
    border-bottom-style : none;
    padding: 15px 5px 25px;
}

.layout02 table td:first-child {
    color : #5e7fb0;
    padding-bottom: 0px;
    font-size: 17px;
    padding-top: 25px;
}


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