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


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


/*contents01 lay01*/

.contents01 {
	margin-bottom: 100px;
}

.contents01 .lay01 {
	width: 88%;
}

.contents01 .lay01 .box {
  justify-content: center;
	flex-direction: row;
	gap:20px;
}

.contents01 .lay01 .box:not(:last-child) {
	margin-bottom: 70px;
}

.contents01 .lay01 .box-img {
	gap:15px 4%;
}

.contents01 .lay01 .box-img > div {
	width: 48%;
}

.contents01 .lay01 .box-detail {
	width: 100%;
}

.contents01 .lay01 table td {
letter-spacing: 0.1em;
	padding: 25px 0px;
	padding-left: 10px;
}

.contents01 .lay01 table td:last-child {
padding-left: 20px;
}


/*contents02 lay02*/

.contents02::before {
top: 80px;
}

.contents02 .lay02 {
	width: 92%;
	border-left-style : solid;
	border-right-style : none;
}

.contents02 .lay02 .box-inner {
	width: 100%;
	overflow-x: auto;
	scrollbar-color: rgba(255,255,255,1) rgba(255,255,255,0);
}
	
.contents02 .lay02 .box-inner::-webkit-scrollbar {
    width: 6px;
	height: 6px;
	border-radius: 30px;
}

.contents02 .lay02 .box-inner::-webkit-scrollbar-track-piece  {
    background-color: rgba(255,255,255,0);
	border-radius: 30px;
}

.contents02 .lay02 .box-inner::-webkit-scrollbar-thumb  {
   border-radius: 30px;
	background-color: rgba(255,255,255,1);
}

.contents02 .lay02 table {
	width: 700px;
}

.contents02 .lay02 table td {
letter-spacing: 0.1em;
	padding: 20px 10px;
	padding-left: 30px;
}
	
.contents02 .lay02 table tr:first-child td {
	padding-top: 30px;
	padding-bottom: 40px;
}


.contents02 .lay02 table tr:last-child td {
	padding-bottom: 40px;
}


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