/*layout style*/
#wrap { display: flex; flex-direction: column; justify-content: space-between; position: relative; max-width: var(--main-width); min-height: 100%; margin: 0 auto; padding-top: var(--header-height); box-shadow: 0 0 2px 2px #f2f2f2; box-sizing: border-box; transition: .2s all ease-out; }
.container { width: 100%; height: calc(100% - 56px); transition: .2s all ease-out; }


/*header style*/
.header { position: fixed; top: 0; left: 0; right: 0; z-index: 2001; max-width: var(--main-width); margin: 0 auto; background: #fff; transition: .2s all ease-out; }
.hd { display: flex; align-items: center; height: var(--header-height); padding: 24px 24px 20px 12px; border-bottom: 1px solid var(--bg-color02); box-sizing: border-box; }
.hd .hd-tit:only-child { margin-left: 12px; }
.hd .hd-tit .tit { font-size: 18px; font-weight: 700; color: var(--primary-color-black01); letter-spacing: -0.05px; line-height: 21px; }
.hd .hd-tit .txt { margin-bottom: 4px; font-size: 13px; font-weight: 400; color: var(--primary-color-black01); letter-spacing: -0.04px; line-height: 16px; }
.hd .hd-tit .txt span { color: var(--main-color); }
.hd .hd-back { width: 36px; height: 36px; margin-right: 12px; border: none; background: url('../images/common/ico_arrow_back1.svg') center center no-repeat; }
.hd .btn-next { display: flex; justify-content: center; align-items: center; width: 80px; height: 38px; margin-left: auto; border: none; border-radius: 8px; background: var(--point-color); font-size: 14px; font-weight: 700; color: var(--main-color); letter-spacing: -0.04px; }


@media only screen and (max-width: 720px) {
	#wrap, .header { max-width: 100%; }
}