@charset "utf-8";

.mob_view { display: none;}

/* main CSS Document */
#visual { height:907px; position: relative;}
.main_visual{position:relative; height:907px; display: block; width: 100%; }
.main_visual ul li.list1{height:907px; background:url("/layout/images/www/main/pnb_visual01.jpg") no-repeat center center;}
.main_visual ul li.list2{height:907px; background:url("/layout/images/www/main/pnb_visual03.jpg") no-repeat center center;}

.visual_txt { position: absolute; left:50%; top: 50%; transform: translateX(-50%); margin-top: -20.5rem; color: #fff; text-align: center; text-shadow: 0 0 20px rgba(0, 0, 0, 0.5);}
.visual_txt .ment_eng { font-size: 2.5rem; font-weight: 500;}
.visual_txt .tit { font-size: 6rem; font-weight: 600; margin: 2rem 3rem;  word-break: keep-all; line-height: 7rem; min-width: 30rem;}
.eng .visual_txt .tit { font-size: 5.6rem; }
.visual_txt a.btn { padding:1.5rem 2.5rem; background-color: #fff; border-radius: 5rem; color: #1A1A1A; font-weight: 600; font-size: 1.7rem; text-shadow:none; }
.visual_txt a .icon { margin-left: 1rem;}
.visual_txt a.btn:hover { background-color:#212F74; color: #fff;  transition:ease-in-out 0.3s;}
.visual_txt a.btn:hover .icon { filter: contrast(0) brightness(10);}

#visual .control { display: flex; align-items: center; gap: 0 1.2rem; justify-content: space-between; position: absolute; left: 50%; transform: translateX(-50%); top: 32rem;z-index:1;}
#visual .control button { display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; width: 7.7rem; height: 7.7rem; border-radius: 5rem; background-color:rgba(0,0,0,.3);}
#visual .control button:hover { background-color:rgba(0,0,0,.6); transition:ease-in-out 0.3s; }
#visual .control button::before{ content: ''; display: block; background-repeat: no-repeat; background-image: url(/layout/images/www/main/pnb_sp.png); background-size: 76.5rem;}
#visual .control .btn_prev::before { width: 1.8rem; height: 2.8rem; background-position: -16.6rem -1rem;}
#visual .control .btn_next::before { width: 1.8rem; height: 2.8rem; background-position: -22rem -1rem;}
#visual .control button.btn_prev { margin-left: -12rem;}
#visual .control button.btn_next { margin-right: -12rem;}

/*제품소개*/
.product { padding:10rem 0 7.5rem;}
.product .tit { display: flex; justify-content: space-between; align-items: center;}
.product .tit .line { width:63%; background-color:#D9D9D9; height: .1rem;  }
.product .tit h2 { font-size: 5.5rem; font-weight: 800; }
.product .tit span { font-size: 1.9rem; font-weight: 600; }
.product .list { margin-top: 7rem;}
.product .list ul { display: flex; justify-content: space-between;}
.product .list ul li a { display: block; text-align: center; }
.product .list ul li a .img {position: relative; }
.product .list ul li a .img img { margin-bottom: 3rem; position: relative; z-index: 2; }
.product .list ul li a h3 { font-size: 3rem; font-weight: 600; margin-bottom: 2rem;}
.product .list ul li a .txt { font-size: 1.9rem;}
.product .list ul li a .txt em { display: block; }
.product .list ul li a .hover { position: absolute; z-index: 3; width:7.8rem; height: 7.8rem; background-color: #212f74; border-radius: 50rem; bottom: 6.8rem; right: 0; opacity: 0;}
.product .list ul li a .hover em { display: block; text-indent: -999rem; width: 0; height: 0;}
.product .list ul li.frozen a .hover { right: -3rem; }
.product .list ul li a:hover .hover { opacity: 1; transition:ease-in-out 0.3s; }
.product .list ul li.hmr { margin-left: -6rem;}
.product .list ul li.hmr a .img::after { transform-origin: bottom left;content: ''; display: block;  width: 9.2rem; height: 9rem; background:url("/layout/images/www/main/pnb_sp.png") no-repeat -64.6rem -21.2rem; position: absolute; top: 9.8rem; right: -4.4rem; z-index: 1;animation:product 1.5s ease-out infinite alternate}
.eng .product .list ul li.oem a .hover { right: 6rem; }

@keyframes product{
	0%{transform:rotate(-15deg);}
	100%{transform:rotate(15deg);}
}

/* 브랜드 */
.brand_info {position:relative;width:100%; max-width:192rem;padding-top: 13rem;  margin:0 auto 15.8rem;overflow:hidden;}
.brand_info .swim_box{position:absolute;top:-15rem;left:50%;transform:translateX(-50%);z-index:-1;}
.brand_info .swim{animation:swim 6s;animation-timing-function: linear;animation-iteration-count: infinite;}
@keyframes swim{
	0%{
		d: path("M 0,400 L 0,150 C 87.51196172248802,128.66985645933016 175.02392344497605,107.3397129186603 264,128 C 352.97607655502395,148.6602870813397 443.4162679425838,211.311004784689 549,202 C 654.5837320574162,192.688995215311 775.3110047846889,111.41626794258372 890,106 C 1004.6889952153111,100.58373205741628 1113.3397129186603,171.0239234449761 1204,191 C 1294.6602870813397,210.9760765550239 1367.3301435406697,180.48803827751195 1440,150 L 1440,400 L 0,400 Z");
	}
	25%{
		d: path("M 0,400 L 0,150 C 64.68899521531102,142.21052631578948 129.37799043062205,134.42105263157896 234,141 C 338.62200956937795,147.57894736842104 483.17703349282294,168.52631578947367 599,159 C 714.8229665071771,149.47368421052633 801.9138755980861,109.47368421052632 890,117 C 978.0861244019139,124.52631578947368 1067.1674641148325,179.57894736842104 1159,193 C 1250.8325358851675,206.42105263157896 1345.4162679425838,178.21052631578948 1440,150 L 1440,400 L 0,400 Z");
	}
	50%{
		d: path("M 0,400 L 0,150 C 105.53110047846891,175.48325358851673 211.06220095693783,200.9665071770335 311,209 C 410.93779904306217,217.0334928229665 505.2822966507176,207.61722488038274 594,204 C 682.7177033492824,200.38277511961726 765.8086124401914,202.56459330143542 860,191 C 954.1913875598086,179.43540669856458 1059.4832535885168,154.12440191387557 1158,145 C 1256.5167464114832,135.87559808612443 1348.2583732057415,142.93779904306223 1440,150 L 1440,400 L 0,400 Z");
	}
	75%{
		d: path("M 0,400 L 0,150 C 122.80382775119617,119.38755980861244 245.60765550239233,88.77511961722487 329,88 C 412.39234449760767,87.22488038277513 456.37320574162675,116.28708133971293 547,125 C 637.6267942583733,133.71291866028707 774.8995215311004,122.07655502392345 875,136 C 975.1004784688996,149.92344497607655 1038.0287081339713,189.40669856459328 1126,196 C 1213.9712918660287,202.59330143540672 1326.9856459330144,176.29665071770336 1440,150 L 1440,400 L 0,400 Z");
	}
	100%{
		d: path("M 0,400 L 0,150 C 87.51196172248802,128.66985645933016 175.02392344497605,107.3397129186603 264,128 C 352.97607655502395,148.6602870813397 443.4162679425838,211.311004784689 549,202 C 654.5837320574162,192.688995215311 775.3110047846889,111.41626794258372 890,106 C 1004.6889952153111,100.58373205741628 1113.3397129186603,171.0239234449761 1204,191 C 1294.6602870813397,210.9760765550239 1367.3301435406697,180.48803827751195 1440,150 L 1440,400 L 0,400 Z");
	}
}
.brand_info .inner { display: flex; gap:10rem; width: 130rem;}
.brand_info .brand { display: flex; flex-direction: column; align-content: flex-end; align-items: flex-end; margin-top: 7.8rem;}
.brand_info .brandimg { margin-left: -17.4rem; position: relative;}
.brand_info .brandimg::after { content: ''; display: block; width: 84.4rem; height: 1.9rem; background:url("/layout/images/www/main/bg2.png") no-repeat 0 0; margin: 2.5rem 0 0 -24rem; }
/*모바일용 이미지 따로있음 brand_imgm.png */
.brand_info .brandimg .img { display: block; background:url(/layout/images/www/main/brand_img.png) no-repeat 0 0; width: 87.8rem; height: 44.1rem; text-indent: -999rem;} 
.brand_info .ai1 { display: block; position: absolute;left:50%; width: 28rem; height: 12.7rem; background:url("/layout/images/www/main/pnb_sp.png") no-repeat 0 -33.5rem;z-index:-1;animation:brand 1.5s ease-out infinite alternate}
@keyframes brand{
	0%{transform:translateY(0);}
	100%{transform:translateY(-3rem);}
}
.brand_info .brandimg ul { position: absolute; right: 0; top: 23.8rem;}
.brand_info .brandimg ul li { margin-bottom: 1.9rem;}
.brand_info .brandimg ul li.store { margin-left: 2rem;}
.brand_info .brandimg ul li a { display: block; width: 16rem; background-color: #212f74; border-radius: 50rem; height: 4.8rem; line-height: 4.8rem;  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25); text-align: center; color:#fff; font-weight: 600; }
.brand_info .brandimg ul li.store a { background-color:#fff; color: #212f74; }
.brand_info .brandimg ul li a i.icon { margin-left: 2rem;}
.brand_info .brandimg ul li.insta a i.icon { filter: contrast(0) brightness(10);}
.brand_info .brandimg ul li a:hover { background-color:#4dabcc; color: #fff; transition:ease-in-out 0.3s; }
.brand_info .brandimg ul li a:hover i.icon { filter: contrast(0) brightness(10);}

.brand_info .brand h2 { color: #212F74; font-size: 5.5rem; font-weight: 800; }
.brand_info .brand .brandlogo { display: block; width: 39.4rem; height: 20.8rem; background:url("/layout/images/www/main/pnb_sp.png") no-repeat 0 -9.3rem; text-indent: -999rem; margin: -2.8rem 0 3rem 0; }
.brand_info .brand .txt { font-size: 2rem; text-align: right; display: block;}
.brand_info .brand .txt em { display: block;}

/* 상품 */
.brand_goods { padding-top: 8rem; position: relative;overflow:hidden;}
.brand_goods .inner {position: relative;width:160rem;}
.brand_goods > .inner{z-index:1;}
.brand_goods .yummy {display: block; width: 37rem; height: 16.7rem; background:url("/layout/images/www/main/pnb_sp.png") no-repeat -.1rem -50rem; position: absolute; top: -7.8rem; left: -8.1rem;}
.brand_goods .swiper{width:122.6rem;padding-left:32.4rem;box-sizing:content-box;}
.brand_goods .swiper-slide{width:28.4rem;}
.brand_goods .swiper-slide .info { display: none;position:absolute;top:0;left:0;transform:translateX(-100%);width:32.4rem;padding:0 4rem 0 0;box-sizing:border-box;}
.brand_goods .swiper-slide .info h3{font-size: 3rem; font-weight: 600; margin-bottom: 2.5rem;}
.brand_goods .swiper-slide .info .txt { word-break: keep-all;}
/*.brand_goods .swiper-slide-active{width:65.8rem;display:flex;justify-content:space-between}*/
.brand_goods .swiper-slide-active .info {  display: block; }
.brand_goods .swiper-slide-prev{opacity:0;}

.brand_goods .swiper-slide a {flex-shrink:0; position:relative; display: block;}
.brand_goods .swiper-slide a .img { display: block;  width: 28.4rem; height: 28.4rem; }
.brand_goods .swiper-slide a .img img { border-radius: 4.6rem; }

.brand_goods .swiper-slide a .hover_w {opacity: 0;}
.brand_goods .swiper-slide-active a .hover_w {opacity: 1;}
.brand_goods .swiper-slide a:hover .hover_w {opacity: 1; transition:ease-in-out 0.2s;}
.brand_goods .swiper-slide a .hover { position: absolute; z-index: 3; width:7.8rem; height: 7.8rem; background-color: #212f74; border-radius: 50rem; border: 3rem solid #fdfcff; box-sizing: content-box; bottom: -3rem; left: -3rem;}
.brand_goods .swiper-slide a .hover em { display: block; text-indent: -999rem; width: 0; height: 0;}
.brand_goods .swiper-slide a .img_m {display: block; width: 15.6rem; height: 13.7rem; background-image: url(/layout/images/www/main/hover_m.png); position: absolute; bottom: 0; left: 0; z-index: 2;}

.brand_goods .control { display: none; align-items: center; gap: 0 1.2rem; justify-content: space-between; position: absolute; bottom: .5rem; z-index:1;}
.brand_goods .control button { display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; padding: .6rem; }
.brand_goods .control button::before{ content: ''; display: block; background-repeat: no-repeat; background-image: url(/layout/images/www/main/pnb_sp.png); background-size: 76.5rem;}
.brand_goods .control .goods_prev::before { width: .9rem; height: 1.4rem; background-position: -34.6rem -1.8rem;}
.brand_goods .control .goods_next::before { width: .9rem; height: 1.4rem;background-position: -37.3rem -1.8rem;}
.brand_goods .control .bar { width:16.3rem; background-color: #D9D9D9; height: .3rem; position: relative; margin-top: .1rem; }
.brand_goods .control .bar .swiper-pagination-progressbar-fill{background-color:#212f74;}
#wrap.eng .brand_goods .control{position:relative;bottom:0;width:100%;max-width:23rem;margin-top:1rem;}
/*brand_goods .control .bar .fill { position: absolute; left: 0; width: 40%; height: .3rem;  background-color:#212F74; }*/


.ai_bg {position: relative; width: 100%; max-width: 192rem; margin: -28.8rem auto 0; height:64rem; overflow: hidden;z-index:0;}
.ai_bg::before { content: ''; display:block; position: absolute; bottom: 0; left: 0; width: 100%; max-width: 192rem; height: 30rem; background:linear-gradient(180deg, #ffffff 0%, #efebfc 100%); z-index: 1; }
/*.ai_bg::after { content: ''; display: block; position: absolute; bottom: -.1rem; left: 0; width: 100%; max-width: 192rem; height: 19.6rem; background:url("/layout/images/www/main/bg3-1.png") no-repeat center bottom; z-index: 3;}*/
.ai_bg span { display: block; position: absolute; background:url("/layout/images/www/main/pnb_sp.png") no-repeat; z-index: 2;}
.ai_bg .ai2 { width: 20.1rem; height: 42rem; background:url(/layout/images/www/main/ch_goods.png) no-repeat center/cover; left: 5%; animation:a2 2.5s ease-out infinite alternate}
@keyframes a2{
	0%{top:31.5rem}
	100%{top:35.5rem;}
}

.ai_bg .wave_box{position:absolute;top:23rem;z-index:3;}
.ai_bg .wave{animation:wave 6s linear infinite;}
@keyframes wave{
	0%{
		d: path("M 0,400 L 0,150 C 40.85995689891787,163.36561015301416 81.71991379783574,176.73122030602832 124,185 C 166.28008620216426,193.26877969397168 209.98030170757494,196.4407289289009 251,177 C 292.01969829242506,157.5592710710991 330.3588793718646,115.505863978368 384,119 C 437.6411206281354,122.494136021632 506.58418080496676,171.53581515762707 544,187 C 581.4158191950332,202.46418484237293 587.3043974082685,184.3508753911237 630,161 C 672.6956025917315,137.6491246088763 752.1982295619592,109.06068327787803 798,107 C 843.8017704380408,104.93931672212197 855.9026843438949,129.40639149736418 897,133 C 938.0973156561051,136.59360850263582 1008.1910330624612,119.31375073266527 1060,116 C 1111.8089669375388,112.68624926733473 1145.3331834062606,123.33860557197477 1189,135 C 1232.6668165937394,146.66139442802523 1286.476233312497,159.33182697943576 1330,162 C 1373.523766687503,164.66817302056424 1406.7618833437514,157.33408651028213 1440,150 L 1440,400 L 0,400 Z");
	}
	25%{
		d: path("M 0,400 L 0,150 C 51.653239929947475,189.54405288293822 103.30647985989495,229.08810576587646 149,211 C 194.69352014010505,192.91189423412354 234.42732049036772,117.19162981943234 269,105 C 303.5726795096323,92.80837018056766 332.9842381786341,144.14537495639425 369,134 C 405.0157618213659,123.85462504360575 447.6357267950963,52.22687035499072 502,75 C 556.3642732049037,97.77312964500928 622.4728546409807,214.9471436236429 663,221 C 703.5271453590193,227.0528563763571 718.4728546409807,121.98455515043767 762,83 C 805.5271453590193,44.015444849562336 877.6357267950964,71.11463577460648 933,108 C 988.3642732049036,144.88536422539352 1026.984238178634,191.55690175113642 1062,197 C 1097.015761821366,202.44309824886358 1128.4273204903677,166.65775722084788 1165,138 C 1201.5726795096323,109.3422427791521 1243.306479859895,87.81206936547203 1290,91 C 1336.693520140105,94.18793063452797 1388.3467600700524,122.09396531726398 1440,150 L 1440,400 L 0,400 Z");
	}
	50%{
		d: path("M 0,400 L 0,150 C 34.317743869074704,140.30430001469756 68.63548773814941,130.60860002939515 111,136 C 153.3645122618506,141.39139997060485 203.77579291647703,161.86989989711697 247,155 C 290.22420708352297,148.13010010288303 326.26134059594244,113.91180038213696 371,105 C 415.73865940405756,96.08819961786304 469.1788446997532,112.48289857433522 522,130 C 574.8211553002468,147.51710142566478 627.0232806050444,166.15660532052223 674,155 C 720.9767193949556,143.84339467947777 762.7280328800695,102.89068014357582 801,91 C 839.2719671199305,79.10931985642418 874.0645878746775,96.28067410517446 916,118 C 957.9354121253225,139.71932589482554 1007.0136156212204,165.98662343572641 1044,157 C 1080.9863843787796,148.01337656427359 1105.8809496404406,103.7728321519198 1153,107 C 1200.1190503595594,110.2271678480802 1269.462585817017,160.92204795659433 1321,176 C 1372.537414182983,191.07795204340567 1406.2687070914915,170.53897602170284 1440,150 L 1440,400 L 0,400 Z");
	}
	75%{
		d: path("M 0,400 L 0,150 C 42.51604426272182,122.7327644368261 85.03208852544364,95.4655288736522 125,114 C 164.96791147455636,132.5344711263478 202.38769016094727,196.87064894221726 251,189 C 299.6123098390527,181.12935105778274 359.4171508307671,101.05187535747868 403,86 C 446.5828491692329,70.94812464252132 473.943706515984,120.92184962786803 508,130 C 542.056293484016,139.07815037213197 582.8080231052968,107.26072613104924 633,84 C 683.1919768947032,60.73927386895076 742.8242010628294,46.03524584793499 797,76 C 851.1757989371706,105.96475415206501 899.8951726433856,180.59829047721078 936,179 C 972.1048273566144,177.40170952278922 995.5951083636285,99.57159224322186 1031,103 C 1066.4048916363715,106.42840775677814 1113.7243939020998,191.1153405499018 1162,217 C 1210.2756060979002,242.8846594500982 1259.5073160279717,209.9670455571709 1306,189 C 1352.4926839720283,168.0329544428291 1396.2463419860142,159.01647722141456 1440,150 L 1440,400 L 0,400 Z");
	}
	100%{
		d: path("M 0,400 L 0,150 C 40.85995689891787,163.36561015301416 81.71991379783574,176.73122030602832 124,185 C 166.28008620216426,193.26877969397168 209.98030170757494,196.4407289289009 251,177 C 292.01969829242506,157.5592710710991 330.3588793718646,115.505863978368 384,119 C 437.6411206281354,122.494136021632 506.58418080496676,171.53581515762707 544,187 C 581.4158191950332,202.46418484237293 587.3043974082685,184.3508753911237 630,161 C 672.6956025917315,137.6491246088763 752.1982295619592,109.06068327787803 798,107 C 843.8017704380408,104.93931672212197 855.9026843438949,129.40639149736418 897,133 C 938.0973156561051,136.59360850263582 1008.1910330624612,119.31375073266527 1060,116 C 1111.8089669375388,112.68624926733473 1145.3331834062606,123.33860557197477 1189,135 C 1232.6668165937394,146.66139442802523 1286.476233312497,159.33182697943576 1330,162 C 1373.523766687503,164.66817302056424 1406.7618833437514,157.33408651028213 1440,150 L 1440,400 L 0,400 Z");
	}
}

/* 플로우 */
.flow { margin-bottom: 12.5rem; margin-top: 1rem; position: relative;}
.flow::after {content: ''; display: block; position: absolute; width: 50%; height: .1rem; background-color:#D9D9D9; right: 0; top: 15rem;}
.flow .inner { display: flex; gap:7rem; }
.flow .title { display: flex; flex-direction: column; width: 44rem; word-break: keep-all;}
.flow .title h2 { font-size: 4.8rem; font-weight: 800;}
.flow .title .tit { font-size: 2.5rem; font-weight: 600; margin: 1rem 0 1.1rem; }
.flow .title .txt { margin-bottom: 2.5rem; }
.flow .title .more { display: block; width: 16rem; background-color: #212f74; border: .1rem solid #212f74; border-radius: 50rem; height: 4.8rem; line-height: 4.8rem; text-align: center; color: #fff; }
.flow .title .more:hover {color: #212f74; background-color: #fff;  border: 1px solid #D9D9D9; transition:ease-in-out 0.3s; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25);}
.flow .flow_list{position:relative;}
.flow .flow_list ul { display: flex;}
.flow .flow_list ul li { display: flex; flex-direction: column; align-items: flex-start; max-width: 25rem; width: 100%; word-break: keep-all; position: relative;}
.flow .flow_list ul li::after { content: ''; display: block; position: absolute; width: 100%; height: .1rem; background-color:#D9D9D9; left: 0; top: 15rem; }
.flow .flow_list ul li .no { font-size: 1.8rem; font-weight: 700; margin-bottom: 1rem;}
.flow .flow_list ul li .no em { font-weight: 600; margin-right: .3rem;}
.flow .flow_list ul li .txt { color: #777; margin-right: 3rem;}
.flow .flow_list ul li span.icon_w { border-radius:50rem 50rem 50rem 0; width: 10.9rem; height: 10.9rem; border: .1rem solid #D9D9D9; margin-bottom: 8.4rem; position: relative;}
.flow .flow_list ul li span.icon_w::before { content: ''; display: block; position: absolute; width: .1rem; height:5rem; background-color:#D9D9D9; left: -.1rem; bottom: -6.6rem; }
.flow .flow_list ul li.point span.icon_w { background-color:#212F74; border: none; }
.flow .flow_list ul li.point span.icon_w .icon {filter: contrast(0) brightness(10);}
.flow .flow_list ul li.point .no { color: #212F74;}
.flow .flow_list .ai3 { display: block; position: absolute;top:-12rem; width: 16rem; height: 4.4rem; background:url("/layout/images/www/main/pnb_sp.png") no-repeat -55.3rem -12.7rem; z-index: 3;animation:fish 10s linear infinite}
@keyframes fish {
  0% { right: 0; transform: translateY(0) rotate(0deg) scaleX(1); }
	15% { transform: translateY(-8px) rotate(3deg) scaleX(1); }
	35% { transform: translateY(8px) rotate(0) scaleX(1) scaleX(1);}
	49% { right: 90%; transform: translateY(0) rotate(3deg) }
	50% { right: 90%; transform: translateY(0) rotate(3deg) scaleX(-1);}
	65% { transform: translateY(-8px) rotate(0) scaleX(-1);}
	85% { transform: translateY(8px) rotate(3deg) scaleX(-1);}
	98% {transform: scaleX(-1);}
	100% { right: 0; transform: translateY(0) rotate(0deg) }
}


@media screen and (max-width: 1800px) { 
	#visual .control button.btn_prev, #visual .control button.btn_next  { margin:0;}
	.brand_goods .inner .yummy { top: -9.8rem; left: -.9rem;}
}

@media screen and (max-width: 1600px) { 
	.product.inner { padding: 10rem 5rem 7.5rem;}
	.flow .inner { flex-direction: column;}
	.flow .title { width: auto;}
	.flow::after { display: none;}
	.flow .flow_list ul { position: relative; justify-content: space-around;}
	.flow .flow_list ul::after {content: ''; display: block; position: absolute; width: 90%; height: .1rem; background-color: #D9D9D9; right: 0; top: 15rem;}
	.flow .flow_list .ai3{top:-42rem;}
	.brand_info .brand .txt em { display: contents;}
	.brand_goods .ai3 { bottom: 5.2rem; right: 30%;}
	.brand_goods .control{display:flex;}
}

@media screen and (max-width: 1550px) { 
	.product .list ul { gap:3rem;}
	.product .list ul li.hmr { margin-left: 0;}
	.product .list ul li.hmr a .img::after { display: none;}
	.product .tit .line { width: 50%;}
	.product .list ul li a .img img { height: 30rem;}
	.product .list ul li a .txt { font-size: 1.7rem;}
	.product .list ul li a .txt em { display: contents; word-break: keep-all;}
	.product .list ul li.frozen a .hover { right:0 }
	.product .list ul li.hmr a .hover { right: .5rem; }
	.product .list ul li.oem a .hover { right: 3.2rem;}
}

@media screen and (max-width: 1350px) {
	.brand_info .inner { justify-content: center; position: relative;}
	.brand_info .brandimg .img { width: 70rem; height: 36.2rem; background-size: cover;}
	.brand_info .brandimg { margin-left: -15.4rem;}
	.brand_info .ai1 { left: 50%; transform: translateX(13%); top: -5.4rem; }
	.brand_info .brand { margin-top: 5rem; justify-content: center; align-items: center;}
	.brand_info .brand .brandlogo { width: 31.9rem; height: 16.8rem; background-size: 60rem; background-position: 0 -7rem; margin: -2.8rem 0 2.7rem;}
	.brand_info .brand .txt { text-align: left; max-width:37rem; font-size: 1.7rem; }
	.brand_info .brandimg ul { top: 16.8rem; right: -2.8rem;}
	.brand_info .brand h2 { padding-left: 13.2rem; font-size: 4.8rem;}
}

@media screen and (max-width: 1230px) {	
	.brand_info { padding-top: 4rem; margin-bottom: 5.8rem;}
	.brand_info .inner { justify-content: start; gap:0; flex-direction: column; width: inherit;}
	.brand_info .brandimg { margin: 0 auto 0; width: 62rem;}
	.brand_info .brandimg .img { width: 62rem; background-position: center;}
	.brand_info .ai1 { left: 48%; transform: none; display: none;}
	.brand_info .brandimg::after { display: none;}
	.brand_info .brandimg ul { left: 0; right: inherit;}
	.brand_info .brand .txt { text-align: center; max-width: 80%; word-break: keep-all; margin-top: 2rem;}
	
	.flow .inner { gap:5rem;}
	.flow::after { display: none;}
	.flow .flow_list ul {gap:2rem;}
	.flow .flow_list ul::after { display: none;}
	.flow .flow_list ul li::after { display: none;}
	.flow .flow_list ul li { border: .1rem solid #D9D9D9; padding:2rem 3rem 3rem 3rem; width: 23%; max-width: none; border-radius: 2rem; align-items: center; justify-content: flex-start;}
	.flow .flow_list ul li .txt { margin-right: 0; text-align: center;}
	.flow .flow_list ul li span.icon_w {margin-bottom: 1rem; border: none; background-color: #F7F9FF; border-radius: 50rem;  }
	.flow .flow_list ul li span.icon_w::before { display: none;}
	.flow .flow_list ul li.point span.icon_w { background-color: #F7F9FF;}
	.flow .flow_list ul li.point span.icon_w .icon { filter: none;}
	.ai_bg .ai3 { left: 60%; }
}

@media screen and (max-width: 1100px) { 
	.product .tit { flex-direction :column;}
	.product .tit .txt { margin-top: 2.5rem;}
	.product .mob_view { display: block;}
	.product .pc_view { display: none;}
	.product .list ul li { width: 33.333%;}
	.product .list ul li a .img img { width:29.4rem; height: 15rem; border-radius: 3rem;}
	.product .list ul li a .hover { right: 2.3rem!important; bottom: 4.3rem;}
}

@media screen and (max-width: 860px) { 
	.flow .flow_list ul {flex-wrap:wrap;}
	.flow .flow_list ul li { width: 47%;}
}

@media screen and (max-width: 830px) { 
	#visual, .main_visual { height: inherit;}
	.visual_txt {top: 15%; margin-top: 0;}
	.visual_txt .ment_eng {font-size: 2rem;}
	.visual_txt .tit { font-size: 4.5rem; line-height: 5rem; }
	.eng .visual_txt .tit { font-size: 4rem; line-height: 5rem; }
	.main_visual ul li { background-size: cover !important; height: 100vw !important;}
	#visual .control { top:  inherit; justify-content: flex-end; bottom: 6rem;}
}

@media screen and (max-width: 750px) { 
	.product .tit .txt { display: none;}
	.product .tit .line { margin-top: 1rem;}
	.product .list ul {flex-direction:column;}
	.product .list ul li { width: 100%;}
	.product .list ul li a { text-align: left; display: flex; gap:3.5rem;}
	.product .list ul li a .img { width: 40%;}
	.product .list ul li a .tw { width: 60%;}
	.product .list ul li a .hover { display: none;}
}

@media screen and (max-width: 720px) { 
	.brand_info { background: none; padding-top: 0;}
	.brand_info .brandimg  { width: 100%;}
	.brand_info .brandimg .img { width: 54rem; height: 30rem; background-size: cover;}
	.brand_info .brandimg ul { top: inherit; bottom: inherit; right: inherit; left: inherit; position: relative; display: flex; justify-content: center; gap:1rem; margin-top: 3rem; }
	.brand_info .brandimg ul li.store { margin-left: 0;}
	.brand_info .brandimg ul li a em { display: block; text-indent: -999rem; width: 0; height:0;}
	.brand_info .brandimg ul li a { width: 4.8rem;}
	.brand_info .brandimg ul li a i.icon { margin-left: 0;}
	.brand_info .brandimg .img { width: 100%; background: url(/layout/images/www/main/brand_imgm.png) no-repeat center bottom; border-radius: 50rem 50rem 0 0;}
	.brand_info .brand { margin-top: 2rem;}
}


@media screen and (max-width: 660px) { 
	.brand_goods .swiper{width:85rem;padding-left:15.4rem;padding-bottom:18rem;margin-left:0;overflow:visible;}
	.brand_goods .swiper-slide{width:19rem;}
	.brand_goods .swiper-slide .info{width:15.4rem;padding-right:2rem;}
	.brand_goods .swiper-slide .info h3{font-size:1.6rem;margin-bottom:1.8rem;}
	.brand_goods .swiper-slide .info .txt{font-size:1.4rem;}
	.brand_goods .swiper-slide a .img{width:19rem;height:19rem;}
	
	.brand_goods .swiper-slide a .img_m{width:9.3rem;height:8.1rem;background-size:cover;}
	.brand_goods .swiper-slide a .hover{width:4.8rem;height:4.8rem;border-width:1.6rem;bottom:-1.6rem;left:-1.6rem;}
	.brand_goods .control{display:none;}
	
	.ai_bg{height:50.5rem;}
	.ai_bg .ai2{left:1%;}
	.ai_bg .wave_box{display:none;}
	
	.flow{margin-top:5rem;}
	.flow .flow_list .ai3{display:none;}
}

@media screen and (max-width: 610px) { 
	.visual_txt .tit { font-size: 3.5rem; line-height: 4rem; }
}

@media screen and (min-width: 491px) { 
	#wrap i.ico_more2.icon{transform:scale(0);transform-origin:bottom left;transition:.3s;}
	#wrap a:hover i.ico_more2.icon{transform:scale(1)}
	#wrap .brand_goods .swiper-slide-active a i.ico_more2.icon{transform:scale(1)}
}

@media screen and (max-width: 490px) { 
	.inner { min-width: 36rem;}
	.main_visual ul li.list1 {min-height: 30rem;}
	#visual .control { display: none;}
	.product {  padding-top: 6rem;}
	.product .list { margin-top: 4rem;}
	.product .tit h2 { font-size:3.5rem; }
	.product .tit .line { display: none;}
	.product .list ul li a { flex-direction: column; gap:0;}
	.product .list ul li a .img { width: 100%;}
	.product .list ul li a .img img { width: 100%;}
	.product .list ul li a .tw { width: 100%; text-align: center;}
	.product .list ul li a h3 { font-size: 2rem; margin-bottom: .9rem;}
	.product .list ul li a .hover { opacity: 1; display: inline-flex; width: 5.8rem; height: 5.8rem;}
	.brand_info .brandimg .img { height: 22rem; background-size: cover;}
	.brand_info .brand h2 { font-size: 3.8rem;}
	.brand_info .brand .brandlogo { background-size: 40rem; background-position: 0 -4.6rem; width: 21.3rem; height: 11.3rem; }
	.flow { margin-bottom: 6.5rem;}
	.flow .title h2 { font-size: 3.5rem; text-align: center;}
	.flow .title .tit { font-size: 1.9rem; text-align: center;}
	.flow .title .txt { text-align: center;}
	.flow .title .more { margin: 0 auto;}
	.flow .flow_list ul { gap:1.2rem 1rem;}
	.flow .flow_list ul li { padding: 1.8rem 1rem;}
	.flow .flow_list ul li .no em { display: block; text-align: center; font-size: 1.7rem; color: #212f74; font-weight: 600;}
	.flow .flow_list ul li .txt { font-size: 1.5rem;}
}