@import url("mobile-navigation.css");

@media (max-width: 1320px) {
	.mobile-body .aisolution-wrapper{
		width:calc(100% - 2rem);
	}
	/*
	.mobile-body .aisolution-wrapper.main {
		width: 100%;
	}
		*/

	.mobile-body .main-box-01{width: 100%;}

	.mobile-body .section .aisolution-wrapper h2{
		font-size: 1.3rem;
        margin-top: 2rem;
	}

	
	.mobile-body .section .aisolution-wrapper p{
		font-size: 0.8rem;
	}	

	.mobile-body .section .aisolution-wrapper .text-center.text-white{
		width:100%;margin:0 auto
	}

	.mobile-body  #pp-nav.right {
		right: 0px;
	}

	.mobile-body .section .aisolution-wrapper .mt-20.flex.items-center.justify-between.gap-x-6{
		margin-top: 2.5rem;
	}

	.mobile-body .section .aisolution-wrapper .h400 {
		height:initial;
	}

	.mobile-body .section .aisolution-wrapper .mt-8 {
		margin-top: 1rem;
	}

	.mobile-body .section .aisolution-wrapper .mt-6 {
		margin-top: 1.1rem;
	}

	.mobile-body .section .aisolution-wrapper .p-8 {
		padding: 1rem;
	}
	.mobile-body .section br{display:none}

	.mobile-body .pp-tableCell {
		display: table-cell;
		vertical-align: top;
	}

	.mobile-body .section.bg-section-3 .aisolution-wrapper .main-box-03{
		display: flex;
		flex-direction: column;
		margin-top: 2rem;gap:1rem
	}

	.mobile-body .p-10 {
		padding: 1rem
	}

	.mobile-body .section.bg-section-3 .aisolution-wrapper .main-box-03 a h2 {
		margin-top: 5px;font-size: 1.2rem;        display: inline-block;
	}

	.mobile-body .section.bg-section-3 .aisolution-wrapper .main-box-03 a h3 {
		font-size: 1.2rem;        display: inline-block;
	}

	.mobile-body .section.bg-section-3 .aisolution-wrapper .main-box-03 .bg-white div {
		display: table-cell;
		vertical-align: bottom;
		height:initial;
		color: #000;
		font-weight: 500;
		font-size: 0.8rem;
		letter-spacing: -0.5px;
		padding-left: 60px;
        text-align: left;padding-top: 1rem;
	}

	.mobile-body .section.bg-section-3 .aisolution-wrapper .main-box-03 .bg-white .more-btn {
		display: inline-block;
        font-size: 12px;
        font-weight: 700;
        color: #000;
        margin-top: 0px;
        position: absolute;
        right:2rem;
        margin-left: 0;
	}

	.mobile-body .section.bg-section-3 .aisolution-wrapper .main-box-03 .bg-white {
		height: initial;
	}

	.mobile-body .section.bg-section-3 .aisolution-wrapper .main-box-03 a:nth-child(1){background:#fff url(/images/main/main-book-icon01.png) 10px 64px no-repeat;background-size: 60px;}
	.mobile-body .section.bg-section-3 .aisolution-wrapper .main-box-03 a:nth-child(2){background:#fff url(/images/main/main-book-icon02.png) 10px 64px no-repeat;background-size: 60px;}
	.mobile-body .section.bg-section-3 .aisolution-wrapper .main-box-03 a:nth-child(3){background:#fff url(/images/main/main-book-icon03.png) 10px 64px no-repeat;background-size: 60px;}

	.mobile-body .section.bg-section-4 .aisolution-wrapper .main-box-04{
		display: flex;
		flex-direction: column;
		margin-top: 2rem;gap:1rem
	}

	.mobile-body .section.bg-section-4 .aisolution-wrapper .main-box-04 .mt10 {
		margin-top: 0px;
	}

	.mobile-body .section.bg-section-4 .aisolution-wrapper .main-box-04 a h2 {
		margin-top: 5px;font-size: 1.2rem;display: inline-block;
	}

	.mobile-body .section.bg-section-4 .aisolution-wrapper .main-box-04 a h3 {
		font-size: 0.85rem;display: inline-block;padding:0;margin-top: 1rem;
	}

	.mobile-body .section.bg-section-4 .aisolution-wrapper .main-box-04 a .eng-baner-img{display:none}
	.mobile-body .section.bg-section-4 .aisolution-wrapper .main-box-04 a.m-pd8{padding:1rem}
	
	.mobile-body .aisolution-wrapper nav{
		display:none
	}

	.mobile-body .aisolution-wrapper .flex.items-center.justify-center{/*display:flex;flex-direction: column; gap: 1rem;*/}
	.mobile-body .aisolution-wrapper .flex.items-center.justify-center a{width: 100%; display: flex;justify-content: center;}
	.mobile-body .aisolution-wrapper .flex.items-center.justify-center a button{width:calc(100% - 5rem) }
	.mobile-body .aisolution-wrapper img{max-width:100%}
	.mobile-body .aisolution-wrapper br{display:none}

	.mobile-body main .aisolution-wrapper .border-b.border-b-black-df.pt-20 .mt-20.grid.grid-cols-3.gap-x-10{        display: flex;
        flex-direction: column;
        width: 100%;
        padding: 1rem;
        gap: 2rem;
        margin-top: 2rem;}
	.mobile-body footer {
		padding:0.5rem 1rem;
	}
	.mobile-body footer span{font-size: 0.74rem;}
	#inquiryPop .modal_cont .inputWrap {
		display: flex;
		width: 100%;
		flex-direction: column;
	}

	#inquiryPop .modal_cont .inputWrap .row {
		width: 100%;
		float: initial;
		display: block;
	}
	.mo-only.hide{display:block}

	.mobile-body .bg-eng {
		background-image: url(/images/inear/mainBG2.png);
		height: 320px;
	}

	.mobile-body .inear-intro .intro-title h1 {
		font-size: 1.5rem;
	}

	.mobile-body .bg-no-repeat.bg-center.bg-cover p {
		font-size: 0.85rem;
		margin-top: 15px;/*width:calc(100% - 4rem)*/
	}
	.btn_start_intv{display:none}

	.mobile-body .inear-intro .aisolution-wrapper {
        width: calc(100% - 4rem);
    }

	
	.mobile-body .renewal2 .box_info.ver2 > div:nth-child(1) .boxImg1{width:70px}
	.mobile-body .renewal2 .box_info.ver2 > div:nth-child(1) .imgCol2{width: calc(100% - 84px);}

	.mobile-body .renewal2 .txt_info1 {
		font-size: 1.2rem;
		padding: 10px 0 0;
	}

	.mobile-body  .renewal2 .box_info {
        padding:2rem 2rem 0 2rem
    }

	.mobile-body .renewal2 .goUp.section2{width:calc(100% - 2rem);margin:0 auto}

	.mobile-body .renewal2 .conts_wrap {
		max-width: 100%;
		padding-top: 2rem;
		width: calc(100% - 1.5rem);
	}

	.mobile-body .mt-6.grid.grid-cols-4{
		grid-template-columns: repeat(4, minmax(0, 1fr));
		display: flex;
		flex-direction: column;
	}

	.mobile-body #SampleInfo.eng.modal_wrap .modal_cont {
		width: 100%;
	}

	.mobile-body #SampleInfo.eng.modal_wrap .pop_tab {
		position: relative;
		width: 100%;
		height: 45px;
	}

	.mobile-body #SampleInfo.eng .modal_cont .pop_tab li {
		width: 33%;
		line-height: 45px;
		font-size: 1rem;
		text-align: center;
	}

	.mobile-body #SampleInfo.eng .pop_select li {	
		width: 33%;
	}

	.mobile-body #SampleInfo.eng .modal_cont img.sample {
		width: 100%;
	}

	.mobile-body #SampleInfo.eng.modal_wrap .modal_close {
		
		top: 0px;
		right: 5px;
	}

	.mobile-body .main3Tabs .main3Tab.c3 {
		width: calc((100% - 28px) / 3);
	}

	.mobile-body .gotoDetail.icon-popup.white{display:none}

	.onlypc {
		font-weight: 400;
		font-size: 13px;
		line-height: 154%;
		color:#444444;
		height: 44px;
		border-radius: 24px;
		background: #e5e8ec;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
        width: calc(100% - 5rem);
	}
}

/* Common responsive layout for the renewal header and production main page. */
@media (max-width: 1320px) {
	.renewal-body.main #myContainer {
		overflow: visible !important;
		touch-action: auto !important;
	}

	.renewal-body.main #myContainer > .section {
		position: relative !important;
		top: auto !important;
		transform: none !important;
		height: auto !important;
	}

	.renewal-body.main #pp-nav {
		display: none;
	}

	html,
	body.renewal-body {
		overflow-x: hidden;
		overflow-y: auto;
	}

	.renewal-body .aisolution-wrapper {
		width: calc(100% - 2rem);
		max-width: 1280px;
		margin-left: auto;
		margin-right: auto;
	}

	.renewal-body img,
	.renewal-body video {
		max-width: 100%;
	}

	.renewal-body.main .main-box-01.mh,
	.renewal-body.main .main-box-02.mh {
		display: block !important;
	}

	.renewal-body.main .main-box-02.mh {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.renewal-body.main .bg-section-2 .main-box-02 {
		grid-auto-rows: 1fr;
	}

	.renewal-body.main .bg-section-2 .main-box-02 > a {
		display: flex;
	}

	.renewal-body.main .bg-section-2 .main-box-02 > a > .flex {
		flex: 1;
		align-items: flex-start;
		height: auto;
		min-height: 188px;
	}

	.renewal-body.main .main-box-01,
	.renewal-body.main .main-box-02,
	.renewal-body.main .main-box-03,
	.renewal-body.main .main-box-04 {
		width: 100%;
		max-width: 100%;
	}

	.renewal-body.main .main-box-01 .sub-bd {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 0.5rem;
	}

	.renewal-body.main .main-box-01 .sub-bd a,
	.renewal-body.main .main-box-01 .sub-bd a:first-child,
	.renewal-body.main .main-box-02 > a > div,
	.renewal-body.main .main-box-04 .eng-baner-img {
		width: 100%;
		max-width: 100%;
		margin-left: 0;
	}

	.renewal-body.main .section .mt-20.flex.items-center.justify-between.gap-x-6 {
		flex-direction: column;
		align-items: stretch;
		gap: 1.5rem;
		margin-top: 2.5rem;
	}

	.renewal-body.main .section .h400 {
		height: auto;
	}

	.renewal-body .modal_wrap .modal_cont {
		max-width: calc(100% - 2rem);
	}

	.renewal-body footer {
		flex-wrap: wrap;
		padding-left: 1rem;
		padding-right: 1rem;
		text-align: center;
	}
}

@media (max-width: 767px) {
	.m-width400 {
		min-width: 200px;
	}
	.renewal-body.main .section,
	.renewal-body.main .pp-section,
	.renewal-body.main .pp-tableCell {
		height: auto !important;
		min-height: 100vh;
	}

	.renewal-body.main .pp-tableCell {
		display: block;
		vertical-align: top;
	}

	.renewal-body.main .section section {
		padding-top: 2rem;
		padding-bottom: 3rem;
	}

	.renewal-body.main .section .aisolution-wrapper h2 {
		font-size: 1.5rem;
		line-height: 1.35;
	}

	.renewal-body.main .section .aisolution-wrapper p {
		font-size: 0.875rem;
	}

	.renewal-body.main .section .button {
		min-height: 44px;
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.renewal-body.main .main-box-01 {
		height: auto;
		padding: 1rem;
	}

	.renewal-body.main .main-box-01 .right-tag {
		float: none;
        display: inline-flex;
        margin-top: 0.5rem;
        gap: 5px;
        flex-flow: wrap;		
	}

	.renewal-body.main .main-box-01 .right-tag span {
		margin-left: 0;
	}

	.renewal-body.main .main-box-01 .sub-bd,
	.renewal-body.main .main-box-02,
	.renewal-body.main .main-box-03,
	.renewal-body.main .main-box-04 {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}

	.renewal-body.main .main-box-01 .sub-bd a,
	.renewal-body.main .main-box-01 .sub-bd a:first-child,
	.renewal-body.main .main-box-02 > a > div {
		width: 100%;
		height: auto;
		min-height: 188px;
	}

	.renewal-body.main .main-box-01 .sub-bd > a {
		overflow: hidden;
	}

	.renewal-body.main .main-box-01 .sub-bd > a > div {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
	}

	.renewal-body.main .main-box-01 .sub-bd .main-arrow-btn {
		flex-shrink: 0;
		margin: 9px auto;
	}

	.renewal-body.main .main-box-01 .sub-bd > a > div > img:last-child {
		display: block;
		width: 100%;
		height: auto;
	}

	.renewal-body.main .main-box-02 .w220 {
		width: auto;
		max-width: 100%;
	}

	.renewal-body.main .main-box-03 .bg-white,
	.renewal-body.main .main-box-04 > a {
		height: auto;
		min-height: 0;
		padding: 1rem;
	}

	.renewal-body.main .main-box-03 .bg-white div {
		display: block;
		height: auto;
		padding-top: 1rem;
	}

	.renewal-body.main .main-box-03 .bg-white .more-btn {
		position: static;
		margin-top: 1rem;
	}

	.renewal-body.main #pp-nav,
	.renewal-body.main .section > a.absolute {
		display: none;
	}

	.renewal-body .modal_wrap .modal_cont {
		width: calc(100% - 2rem);
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
	}

	.renewal-body footer {
		position: static;
		flex-direction: column;
		gap: 0.75rem;
	}
}