.p_section,
.t_section {
	position: relative;
}
.p_section img,
.t_section img {
	width: 100%;
}

/* P1 */

.p_01 {
	position: relative;
	width: 100%;
}

/* T - 01 - 02 - 03 - 04 */

.t_01,
.t_03,
.t_04,
.t_08 {
		display: flex;
    justify-content: space-between;
    align-items: flex-start;
    column-gap: 1em;
    grid-gap: 1em;
		flex-wrap: wrap;
}
.t_section .t_items {
    flex-grow: 1;
    margin: 0;
		position: relative;
}
.t_section .t_01 .t_items {
    max-width: 50%;
}
.t_section .t_02 .t_items {
    max-width: 100%;
}
.t_section .t_03 .t_items {
    max-width: 33.333333%;
}
.t_section .t_08 .t_items {
    max-width: 25%;
}
.full_width {
	max-width: 100% !important;
	min-width: 100% !important;
}



/* hover effect */

.pt_hover {
	position: absolute;
	top:0;
	opacity: 0;
	width: 100%;
	height: 100%;
	transition: opacity 0.2s linear;
}
.pt_hover_2020 {
	position: absolute;
	top:0;
	opacity: 1;
	width: 100%;
	height: 100%;
}
.pt_hover_2020 p {
	position: absolute;
    bottom: 20px;
	color: #fff;
	font-size: 16px;
}

.pt_hover.wht_effect {
	background-color: #fff;
}

.z_button {
	position: absolute;
}

.b_items {
	position: relative;
}

.bt_hover {
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity 0.2s linear;
}


@media only screen and (max-width:533px) {
	
	.p_section  {
		margin-bottom: 0;
	}
	.t_section {
		margin-bottom: 0;
	}
	
	.z_button {
		bottom: 0!important;
        left: 2em;
        width: calc(100% - 4em);
	}
	.b_items {
		display: block;
		margin-bottom: 2em;
	}
	.t_section .t_03 .t_items {
        max-width: 100%;
		margin: 0;
	}
	.t_section .t_04 .t_items {
        max-width: 100%;
		margin: 0;
	}
	.t_section .t_08 .t_items {
		max-width: 50%;
	}
	.pt_hover_2020 p {
		display: none;
	}
	
}

@media only screen and (min-width:534px) {
	
	.t_items:hover .pt_hover {
		opacity: 1;
	}
	.t_items:hover .pt_hover.wht_effect {
		opacity: 0.2;
	}
	.b_items:hover .bt_hover {
		opacity: 1;
	}
	
	.z_button {
    bottom: 2em;
    left: 2em;
	}
	.b_items {
		display: inline-block;
		margin-right: 1em;
	}
	
	.t_section .t_04 .t_items {
    max-width: 50%;
	}
	
}


@media only screen and (max-width:979px) {
	
	.p_section  {
		margin-bottom: 10px;
	}
	.t_section {
		/* margin-bottom: 10px; */
		margin-bottom: 0;
	}
	
}


@media only screen and (min-width:980px) {
	
	.p_section  {
		top: 100px;
		margin-bottom: 120px;
	}
	.t_section {
		/* margin-bottom: 20px; */
		margin-bottom: 0;
	}
	
	.z_button {
		bottom: 16em;
		left: 7em;
	}
	
}




