@charset "utf-8";
/*==============================================

    ----------------------------------------------------------------
	* Date		:	2021-09-13
	* Modify		:   
	* Name		:	helper.css
	----------------------------------------------------------------
	
	- Description -

==============================================*/
/* layout */
.grid-1 {width:100%}
.grid-2 {width:50%}
.grid-3 {width:33.33%}
.grid-4 {width:25%}
.grid-5 {width:20%}
.grid-6 {width:16.66%}
.grid-7 {width:14.28%}
.grid-8 {width:12.5%}

.width-per-10 {width:10% !important;}
.width-per-20 {width:20% !important;}
.width-per-30 {width:30% !important;}
.width-per-40 {width:40% !important;}
.width-per-50 {width:50% !important;}
.width-per-60 {width:60% !important;}
.width-per-70 {width:70% !important;}
.width-per-80 {width:80% !important;}
.width-per-90 {width:90% !important;}
.width-per-100 {width:100% !important;}



/* margin(px) */
.mt-px-0 {margin-top:0px !important;}
.mt-px-5 {margin-top:5px !important;}
.mt-px-10 {margin-top:10px !important;}
.mt-px-15 {margin-top:15px !important;}
.mt-px-20 {margin-top:20px !important;}
.mt-px-25 {margin-top:25px !important;}
.mt-px-30 {margin-top:30px !important;}
.mt-px-35 {margin-top:35px !important;}
.mt-px-40 {margin-top:40px !important;}
.mt-px-45 {margin-top:45px !important;}
.mt-px-50 {margin-top:50px !important;}

.mr-px-0 {margin-right:0px !important;}
.mr-px-5 {margin-right:5px !important;}
.mr-px-10 {margin-right:10px !important;}
.mr-px-15 {margin-right:15px !important;}
.mr-px-20 {margin-right:20px !important;}
.mr-px-25 {margin-right:25px !important;}
.mr-px-30 {margin-right:30px !important;}
.mr-px-35 {margin-right:35px !important;}
.mr-px-40 {margin-right:40px !important;}
.mr-px-45 {margin-right:45px !important;}
.mr-px-50 {margin-right:50px !important;}

.mb-px-0 {margin-bottom:0px !important;}
.mb-px-5 {margin-bottom:5px !important;}
.mb-px-10 {margin-bottom:10px !important;}
.mb-px-15 {margin-bottom:15px !important;}
.mb-px-20 {margin-bottom:20px !important;}
.mb-px-25 {margin-bottom:25px !important;}
.mb-px-30 {margin-bottom:30px !important;}
.mb-px-35 {margin-bottom:35px !important;}
.mb-px-40 {margin-bottom:40px !important;}
.mb-px-45 {margin-bottom:45px !important;}
.mb-px-50 {margin-bottom:50px !important;}

.ml-px-0 {margin-left:0px !important;}
.ml-px-5 {margin-left:5px !important;}
.ml-px-10 {margin-left:10px !important;}
.ml-px-15 {margin-left:15px !important;}
.ml-px-20 {margin-left:20px !important;}
.ml-px-25 {margin-left:25px !important;}
.ml-px-30 {margin-left:30px !important;}
.ml-px-35 {margin-left:35px !important;}
.ml-px-40 {margin-left:40px !important;}
.ml-px-45 {margin-left:45px !important;}
.ml-px-50 {margin-left:50px !important;}



/* margin(percent) */
.mt-per-0 {margin-top:0% !important;}
.mt-per-5 {margin-top:5% !important;}
.mt-per-10 {margin-top:10% !important;}
.mt-per-15 {margin-top:15% !important;}
.mt-per-20 {margin-top:20% !important;}
.mt-per-25 {margin-top:25% !important;}
.mt-per-30 {margin-top:30% !important;}
.mt-per-35 {margin-top:35% !important;}
.mt-per-40 {margin-top:40% !important;}
.mt-per-45 {margin-top:45% !important;}
.mt-per-50 {margin-top:50% !important;}

.mr-per-0 {margin-right:0% !important;}
.mr-per-5 {margin-right:5% !important;}
.mr-per-10 {margin-right:10% !important;}
.mr-per-15 {margin-right:15% !important;}
.mr-per-20 {margin-right:20% !important;}
.mr-per-25 {margin-right:25% !important;}
.mr-per-30 {margin-right:30% !important;}
.mr-per-35 {margin-right:35% !important;}
.mr-per-40 {margin-right:40% !important;}
.mr-per-45 {margin-right:45% !important;}
.mr-per-50 {margin-right:50% !important;}

.mb-per-0 {margin-bottom:0% !important;}
.mb-per-5 {margin-bottom:5% !important;}
.mb-per-10 {margin-bottom:10% !important;}
.mb-per-15 {margin-bottom:15% !important;}
.mb-per-20 {margin-bottom:20% !important;}
.mb-per-25 {margin-bottom:25% !important;}
.mb-per-30 {margin-bottom:30% !important;}
.mb-per-35 {margin-bottom:35% !important;}
.mb-per-40 {margin-bottom:40% !important;}
.mb-per-45 {margin-bottom:45% !important;}
.mb-per-50 {margin-bottom:50% !important;}

.ml-per-0 {margin-left:0% !important;}
.ml-per-5 {margin-left:5% !important;}
.ml-per-10 {margin-left:10% !important;}
.ml-per-15 {margin-left:15% !important;}
.ml-per-20 {margin-left:20% !important;}
.ml-per-25 {margin-left:25% !important;}
.ml-per-30 {margin-left:30% !important;}
.ml-per-35 {margin-left:35% !important;}
.ml-per-40 {margin-left:40% !important;}
.ml-per-45 {margin-left:45% !important;}
.ml-per-50 {margin-left:50% !important;}



/* padding(px) */
.pt-px-0 {padding-top:0px !important;}
.pt-px-5 {padding-top:5px !important;}
.pt-px-10 {padding-top:10px !important;}
.pt-px-15 {padding-top:15px !important;}
.pt-px-20 {padding-top:20px !important;}
.pt-px-25 {padding-top:25px !important;}
.pt-px-30 {padding-top:30px !important;}
.pt-px-35 {padding-top:35px !important;}
.pt-px-40 {padding-top:40px !important;}
.pt-px-45 {padding-top:45px !important;}
.pt-px-50 {padding-top:50px !important;}

.pr-px-0 {padding-right:0px !important;}
.pr-px-5 {padding-right:5px !important;}
.pr-px-10 {padding-right:10px !important;}
.pr-px-15 {padding-right:15px !important;}
.pr-px-20 {padding-right:20px !important;}
.pr-px-25 {padding-right:25px !important;}
.pr-px-30 {padding-right:30px !important;}
.pr-px-35 {padding-right:35px !important;}
.pr-px-40 {padding-right:40px !important;}
.pr-px-45 {padding-right:45px !important;}
.pr-px-50 {padding-right:50px !important;}

.pb-px-0 {padding-bottom:0px !important;}
.pb-px-5 {padding-bottom:5px !important;}
.pb-px-10 {padding-bottom:10px !important;}
.pb-px-15 {padding-bottom:15px !important;}
.pb-px-20 {padding-bottom:20px !important;}
.pb-px-25 {padding-bottom:25px !important;}
.pb-px-30 {padding-bottom:30px !important;}
.pb-px-35 {padding-bottom:35px !important;}
.pb-px-40 {padding-bottom:40px !important;}
.pb-px-45 {padding-bottom:45px !important;}
.pb-px-50 {padding-bottom:50px !important;}

.pl-px-0 {padding-left:0px !important;}
.pl-px-5 {padding-left:5px !important;}
.pl-px-10 {padding-left:10px !important;}
.pl-px-15 {padding-left:15px !important;}
.pl-px-20 {padding-left:20px !important;}
.pl-px-25 {padding-left:25px !important;}
.pl-px-30 {padding-left:30px !important;}
.pl-px-35 {padding-left:35px !important;}
.pl-px-40 {padding-left:40px !important;}
.pl-px-45 {padding-left:45px !important;}
.pl-px-50 {padding-left:50px !important;}



/* padding(percent) */
.pt-per-0 {padding-top:0% !important;}
.pt-per-5 {padding-top:5% !important;}
.pt-per-10 {padding-top:10% !important;}
.pt-per-15 {padding-top:15% !important;}
.pt-per-20 {padding-top:20% !important;}
.pt-per-25 {padding-top:25% !important;}
.pt-per-30 {padding-top:30% !important;}
.pt-per-35 {padding-top:35% !important;}
.pt-per-40 {padding-top:40% !important;}
.pt-per-45 {padding-top:45% !important;}
.pt-per-50 {padding-top:50% !important;}

.pr-per-0 {padding-right:0% !important;}
.pr-per-5 {padding-right:5% !important;}
.pr-per-10 {padding-right:10% !important;}
.pr-per-15 {padding-right:15% !important;}
.pr-per-20 {padding-right:20% !important;}
.pr-per-25 {padding-right:25% !important;}
.pr-per-30 {padding-right:30% !important;}
.pr-per-35 {padding-right:35% !important;}
.pr-per-40 {padding-right:40% !important;}
.pr-per-45 {padding-right:45% !important;}
.pr-per-50 {padding-right:50% !important;}

.pb-per-0 {padding-bottom:0% !important;}
.pb-per-5 {padding-bottom:5% !important;}
.pb-per-10 {padding-bottom:10% !important;}
.pb-per-15 {padding-bottom:15% !important;}
.pb-per-20 {padding-bottom:20% !important;}
.pb-per-25 {padding-bottom:25% !important;}
.pb-per-30 {padding-bottom:30% !important;}
.pb-per-35 {padding-bottom:35% !important;}
.pb-per-40 {padding-bottom:40% !important;}
.pb-per-45 {padding-bottom:45% !important;}
.pb-per-50 {padding-bottom:50% !important;}

.pl-per-0 {padding-left:0% !important;}
.pl-per-5 {padding-left:5% !important;}
.pl-per-10 {padding-left:10% !important;}
.pl-per-15 {padding-left:15% !important;}
.pl-per-20 {padding-left:20% !important;}
.pl-per-25 {padding-left:25% !important;}
.pl-per-30 {padding-left:30% !important;}
.pl-per-35 {padding-left:35% !important;}
.pl-per-40 {padding-left:40% !important;}
.pl-per-45 {padding-left:45% !important;}
.pl-per-50 {padding-left:50% !important;}

.fix {overflow:hidden !important;}


/* font */
.font-size-12 {font-size:12px !important;}
.font-size-13 {font-size:12px !important;}
.font-size-14 {font-size:14px !important;}
.font-size-15 {font-size:15px !important;}
.font-size-16 {font-size:16px !important;}
.font-size-17 {font-size:17px !important;}
.font-size-18 {font-size:18px !important;}
.font-size-19 {font-size:19px !important;}
.font-size-20 {font-size:20px !important;}
.font-size-21 {font-size:21px !important;}
.font-size-22 {font-size:22px !important;}
.font-size-23 {font-size:23px !important;}
.font-size-24 {font-size:24px !important;}

.font-weight-100 {font-weight:100 !important;}
.font-weight-300 {font-weight:300 !important;}
.font-weight-400 {font-weight:400 !important;}
.font-weight-500 {font-weight:500 !important;}
.font-weight-700 {font-weight:700 !important;}
.font-weight-900 {font-weight:900 !important;}

.font-underline {text-decoration:underline !important;}
.hover-underline:hover {text-decoration:underline !important;}

/* align */
.align-left {text-align:left !important;}
.align-right {text-align:right !important;}
.align-center {text-align:center !important;}

.float-left {float:left !important;}
.float-right {float:right !important;}

.vertical-top {vertical-align:top !important;}
.vertical-middle {vertical-align:middle !important;}
.vertical-bottom {vertical-align:bottom !important;}


/* display */
.display-table {display:table; width:100%; height:100%;}
.display-table-cell {display:table-cell; width:100%; height:100%; vertical-align:middle;}
.display-block {display:block !important;}
.display-inline-block {display:inline-block !important;}
.pc-block {display:block !important;}
.mobile-block {display:none !important;}
.blind {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap; border:0;}

/* flex */
.flex {display:flex;}
.flex-inline {display:inline-flex;}
.flex-direction-row {flex-direction:row;}
.flex-direction-column {flex-direction:column;}
.flex-wrap {flex-wrap:wrap;}
.flex-nowrap {flex-wrap:nowrap;}
.flex-justify-content-start {justify-content:flex-start;}
.flex-justify-content-end {justify-content:flex-end;}
.flex-justify-content-center {justify-content:center;}
.flex-justify-content-between {justify-content:space-between;}
.flex-justify-content-around {justify-content:space-around;}
.flex-align-content-start {align-content:flex-start;}
.flex-align-content-end {align-content:flex-end;}
.flex-align-content-center {align-content:center;}
.flex-align-content-between {align-content:space-between;}
.flex-align-content-around {align-content:space-around;}
.flex-align-self-start {align-self:flex-start;}
.flex-align-self-center {align-self:center;}
.flex-align-self-end {align-self:flex-end;}
.flex-align-items-start {align-items:flex-start;}
.flex-align-items-end {align-items:flex-end;}
.flex-align-items-center {align-items:center;}
.flex-align-items-baseline {align-items:baseline;}
.flex-auto {flex:0 0 auto;}
.flex-1 {flex:1 !important;}
.flex-2 {flex:2 !important;}
.flex-3 {flex:3 !important;}
.flex-4 {flex:4 !important;}
.flex-5 {flex:5 !important;}
.flex-auto-1 {flex:0 0 auto !important; width:100% !important;}
.flex-auto-2 {flex:0 0 auto !important; width:50% !important;}
.flex-auto-3 {flex:0 0 auto !important; width:33.33% !important;}
.flex-auto-4 {flex:0 0 auto !important; width:25% !important;}
.flex-auto-5 {flex:0 0 auto !important; width:20% !important;}

@media screen and (max-width:768px){
	.pc-block {display:none !important;}
	.mobile-block {display:block !important;}

}