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

@media (max-width: 768px) {
	/* header */
	#GoTop { display: none!important; }
	header, .header { height: 64px; }
	.header h1 { width: 20%; position: absolute; left: 1.6rem; top: 12px; }
	.inner { width: 90%; }
	.login-wrap, .gnb_links{ display: none; }
    .button-container { display: block; right: 1.6rem; top: 32px; }
	
	/* visual */
	.main-visual { height: 360px; background-position: -100px 0; }
	.main-visual div h2 { left: 25%; top: 50%; transform: translateY(0%); }
	.main-visual div h2 p { font-size: var(--font-size-b); line-height: 32px; }
	
	/* common */
	section { padding: 50px 0; }
	.inner { width: 84%; }
	.section-01 .inner > div { display: flex; flex-direction: column; }
	.section-01 .inner > div > div:nth-child(1) { margin-bottom: 50px!important; }
	.section-01 .text-01 { font-size: var(--font-size-title2); margin-bottom: 10px; }
	.section-01 .text-02 { font-size: var(--font-size-l); line-height: 24px; }
	.section-02 h3 { font-size: var(--font-size-title1); margin-bottom: 30px; }
	.section-02 h3 span { font-size: var(--font-size-l); }
	.section-02 ul { flex-direction: column; }
	.section-02 ul li { width: 100%; margin-bottom: 10px; padding: 20px 0; }
	.section-03 { margin-bottom: 0; }
	.section-03 h3 { font-size: var(--font-size-title3); line-height: 42px; }
	.section-03 p { font-size: var(--font-size-b); line-height: 27px; }
	.section-03 .thumb { position: relative; width: 100%; right: 0; top: 0; }
	footer .logo { position: relative; }
	footer .inner { padding-bottom: 100px!important; }
}


