html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,input,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	font-family:'pretendard',serif;
	position:relative;
	box-sizing:border-box;
	font-weight: 500;
}
html,body {
	font-family:"pretendard",sans-serif;
	-webkit-font-smoothing:antialiased;
	height:100vh;
	box-sizing:border-box;
}
body {
	*word-break:break-all;
	-ms-word-break:break-all;
	-webkit-text-size-adjust:100% !important;
	-moz-text-size-adjust:100% !important;
	-ms-text-size-adjust:100% !important;
	line-height:1;
}
ul,li{
	list-style-type: none;
}

button {
	font-family:"pretendard",sans-serif;
	border:0px;
	color:#fff;
	background-color:transparent;
	cursor:pointer;
	-webkit-transition:all 250ms ease;
	-moz-transition:all 250ms ease;
	-o-transition:all 250ms ease;
	-ms-transition:all 250ms ease;
	transition:all 250ms ease;
}
button:hover {
	-webkit-transition:all 250ms ease;
	-moz-transition:all 250ms ease;
	-o-transition:all 250ms ease;
	-ms-transition:all 250ms ease;
	transition:all 250ms ease;
}

:hover {
	transition:all 250ms ease;
}
* {
	font-size:16px;
}
:root {
	--clr1:#3E9AD5;
	--clr2:#E86C78;
	--clr2-h:#E95462;
	--clr3:#28A7E1;
	--clr3-h:#0894D4;
	--clr4:#3289C1;
	--txt:#42464B;
	

}


.mgleft{margin-left:10px}
.mgbtm {margin-bottom:27px!important;}
#poster {
	width:1200px;
	border:1px solid #ddd;
	padding-top:100px;
	margin:0 auto;
}
.toplogoset {
	display:flex;
	justify-content: space-between;
	align-items: flex-start;
	padding:30px 30px 0px 30px;
}
.toplogoset img{
	height:50px;
}
.btnwrap {
	width:1200px;
	padding:20px 30px 0px 30px;
	display:flex;
	justify-content: flex-end;
	gap:10px
}
.btnwrap button {
	background: var(--clr1);
	width:300px;
	padding:15px 20px;
	border-radius: 4px;
	display:flex;
	justify-content: space-between;
	align-items: center;
	text-align: left;
	font-size:15px;
}
.btnwrap button i {
	margin-left:10px;
	transition:all 250ms ease;
}
.btnwrap button br{
	display:none
}
.btnwrap button:hover {
	background: var(--clr4);
}
.btnwrap button:hover i{
	transform: translate(0.3em);
	transition:all 250ms ease;
}
.tablet {
	background: url(../img/tablet_bak.png) center no-repeat;
	width:900px;
	height:511px;
	margin:0 auto;
	padding:28px;
}
.tablet iframe{
	border-radius: 20px;
	width:100%;
	height:450px
}
#poster .contents {
	padding:0px 50px;
	height:1070px;
	background: url(../img/background.png) bottom no-repeat;
}
.titleset .m_view {
	display:none
}
.bannerwrap {
	display:flex; 
	justify-content: space-between;
	gap:20px;
	background: var(--clr1);
	padding:0px 80px 30px 80px;
}
.bannerwrap .bnr {
	width:50%;
	box-shadow: 2px 2px 10px rgb(0 0 0 / 20%);
	background: #fff;
	border-radius: 10px;
	padding-bottom:20px;
	border:3px solid #fff;
	border-radius: 0px 0px 10px 10px;
}
.bannerwrap .bnr h1{
	height:70px;
	display:flex;
	justify-content: center;
	align-items: center;
	margin-bottom:20px;
	color:#fff;
	font-size:28px;
	font-weight: 700;
	gap:10px;
}
.bannerwrap .bnr h1 span{
	font-size:16px;
	font-weight: 400;
	margin-top:13px
	}
.bannerwrap .bnr h2{
	display:flex; 
	align-items: center;
	font-size:20px;
	font-weight:600;
	margin-bottom:8px

}
.bannerwrap .bnr>div{
	border-bottom:1px dashed #ddd;
	padding-bottom:15px;
	margin:0px 20px 20px 20px
}
.bannerwrap .bnr div:last-of-type{
	border:0px;
	margin-bottom:0px;
}
.bannerwrap .bnr p{
	color:var(--txt);
	font-size:16px;
	margin-left:20px;
	font-weight: 600;
	line-height: 1.3;
}
.bannerwrap .bnr p>br{
	display:none
}
.bannerwrap .bnr ul{
	color:var(--txt);
	font-size:16px;
	margin-left:20px;
	font-weight: 600;
	line-height: 1.3;
}
.bannerwrap .bnr ul li{
	margin-bottom:5px;
}
.bannerwrap .bnr .service{
	display:flex;
	justify-content: space-between;
	align-items: center;
	margin:10px 20px 0px 20px
}
.bannerwrap .bnr .service>div{
	background:#FFF9FA;
	border:1px solid #F3D5DA;
	border-radius: 4px;
	width:128px;
	text-align: center;
	font-size:14px;
	line-height: 1.3;
	padding:10px 0px;
}
.bannerwrap .bnr .service i{
	color:var(--clr2);
}
.bannerwrap .bnr .service>div>b{
	display:block;
}
.bannerwrap .bnr .service>div>span{
	font-size:20px;
	font-weight: 700;
	color:#000;
	display:block;
}
.bannerwrap .bnr h2::before{
	content: "";
	width:10px;
	height:10px;
	border-radius: 50%;
	border:4px solid;
	margin-right:4px;
	display:inline-block;
}
.bannerwrap .bnr b{
	font-weight: 700;
}
.bannerwrap .bnr button {
	width:calc(100% - 40px);
	font-size:20px;
	font-weight: 600;
	color:#fff;
	display:flex;
	justify-content: center;
	align-items: center;
	height:55px;
	margin:0 auto;
	border-radius: 4px;
}

.bannerwrap .bnr button i{
	font-size:17px;
	margin:3px 0px 0px 10px;
	transition:all 250ms ease;
}
.bannerwrap .bnr button:hover i{
	transform: translate(0.3em);
	transition:all 250ms ease;
}

.bannerwrap .st1 h1{
	background: var(--clr2);
}

.bannerwrap .st1 h2::before{
	border-color: var(--clr2);
}
.bannerwrap .st1 b{
	color:var(--clr2)
}
.bannerwrap .st1 button {
	background:var(--clr2);
}
.bannerwrap .st1 button:hover {
	background:var(--clr2-h);
}


.bannerwrap .st2 h1{
	background: var(--clr3);
}
.bannerwrap .st2 h2::before{
	border-color: var(--clr3);
}
.bannerwrap .st2 b{
	color:var(--clr3)
}
.bannerwrap .st2 button {
	background:var(--clr3);
}
.bannerwrap .st2 button:hover {
	background:var(--clr3-h);
}

.footer {
	background: var(--clr4);
	padding:20px 80px;
	display:flex;
	justify-content: space-between;
	align-items: flex-start;
}
.footer button{
	width:250px;
	text-align: center;
	background:rgba(255,255,255,0.1);
	border:1px solid rgba(255,255,255,0.3);
	border-radius:4px;
	padding:10px;
	display:flex;
	align-items: center;
	justify-content: center;
}
.footer button:hover {
	background:var(--clr4);
	border:1px solid rgba(255,255,255,0.3);

	
}
.footer button img{
	height:28px;
}