<style type="text/css">

/*  ==========================================================================
	@ COMMON.CSS
	========================================================================== */
	:root
	{
		--theme-primary        : #1a91dd;
		--theme-secondary      : #000000;
 
		--theme-white          : #ffffff;
		--theme-black          : #333333;
	}
	::-moz-selection {
		background:var(--theme-primary);
		color:var(--theme-white);
	}
	::selection {
		background:var(--theme-primary);
		color:var(--theme-white);
	}
	* {
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
		-webkit-appearance: none;
		-webkit-text-size-adjust:none;
		-webkit-font-smoothing:subpixel-antialiased;
		-webkit-overflow-scrolling:touch;
	}
/*  ==========================================================================
	@ INIT
	========================================================================== */
	html,body {
		font-family:'Noto Sans KR',sans-serif !important;
		font-weight:400;
		color:var(--theme-black);
	}
	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	p {
		margin:0;
		padding:0;
	}
	ul,
	ol,
	dl,
	dt,
	dd {
		padding:0;
		margin:0;
	}
	li {
		list-style:none;
		margin-top: 5px;
	}
	a {
		vertical-align:middle;
		text-decoration:none;
	}
	i {
		vertical-align:middle;
	}
	span {
		vertical-align:middle;
	}
	img {
		max-width:100%;
		height:auto;
		vertical-align:middle;
	}
	input,
	textarea,
	select {
		outline:none;
		border-radius:0;
		vertical-align:middle;
	}
	button {
		border:none;
		outline:none;
		background-color:transparent;
		padding:0;
		vertical-align:middle;
		cursor:pointer;
	}
	table {
		padding:0; 
		border-spacing:0px; 
		border:0; 
		border-collapse:collapse;
	}
	caption,
	legend {
		display:none;
	}
	fieldset {
		margin:0;
		padding:0;
		border:none;
	}
/*  ==========================================================================
	@ TAGS
	========================================================================== */
	h1 {
		font-size:22px;
		margin-bottom:15px;
	}
	h2 {
		font-size:20px;
		margin-bottom:15px;
	}
	h3 {
		font-size:18px;
		margin-bottom:15px;
	}
	h4 {
		font-size:16px;
		margin-bottom:15px;
	}
	h5 {
		font-size:14px;
		margin-bottom:15px;
	}
	h6 {
		font-size:13px;
		margin-bottom:15px;
	}
	p {
		line-height:18px;
		/*text-align:justify;*/
	}
	a {
		position:relative;
		display:inline-block;
		/*color:var(--theme-black);*/
		margin-left:5px;
	}
	a:first-child {
		margin-left:0;
	}
	a:hover {
		color:var(--theme-primary);
	}
	i {
		font-size:35px;
	} 
	label {
		font-weight:bold;
	}
/*  ==========================================================================
	@ COMMON CLASS
	========================================================================== */
	.full {
		width:100%;
	}
	.bold {
		font-weight:800;
		font-weight:bold;
	}
	.underline {
		text-decoration:underline;
	}
	.right {
		text-align:right;
	}
	.center {
		position:absolute;
		width:100%;
		top:50%;
		transform:translateY(-50%);
	}

	/* 삭제 */
	.ajax {
		display:none;
	}
/*  ==========================================================================
	@ COLUMN
	========================================================================== */
	.col {
		float:left;
	}
	.col_2 {
		width:50%;
	}
	.col_3 {
		width:33.33333333%;
	}
	.col_4 {
		width:25%;
	}
	.col_group_2_15 {
		padding-right:15px;
	}
	.col_group_2_15 .col {
		width:50%;
		margin-left:30px;
		margin-right:-15px;
	}
	.col_group_2_15 .col:nth-child(3n+1) {
		margin-left:0;
	}


    	.col_group_3_10 {
		padding-right:20px;
	}
    


	.col_group_3_10 .col {
		width:33.33333333%;
		margin-left:30px;
		margin-right:-20px;
	}
	.col_group_3_10 .col:nth-child(3n+1) {
		margin-left:0;
	}
	.col_group_3_15 {
		padding-right:30px;
	}
	.col_group_3_15 .col {
		width:33.33333333%;
		margin-left:45px;
		margin-right:-30px;
	}
	.col_group_3_15 .col:nth-child(3n+1) {
		margin-left:0;
	}
	.col_group_4_15 {
		padding-right:60px;
	}
	.col_group_4_15 .col {
		width:33.33333333%;
		margin-left:75px;
		margin-right:-60px;
	}
	.col_group_4_15 .col:nth-child(3n+1) {
		margin-left:0;
	}
/*  ==========================================================================
	@ CONTAINER
	========================================================================== */
	.container {
		position:relative;
		height:100%;
		/* width:92%;
		margin:0 4%; */
		width:96%;
		margin:0 0 0 4%;
	}
/*  ==========================================================================
	@ ROYALSLIDER
	========================================================================== */
	.rsSlider.bullet .rsBullets {
		position:absolute;
		width:100%;
		height:10px;
		bottom:10px;
		text-align:center;
	}
	.rsSlider.bullet .rsBullet {
		display:inline-block;
		margin-left:5px;
		vertical-align:top;
		cursor:pointer;
	}
	.rsSlider.bullet .rsBullet:first-child {
		margin-left:0;
	}
	.rsSlider.bullet .rsBullet span {
		display:block;
		width:10px;
		height:10px;
		background-color:#555555;
	}
	.rsSlider.bullet .rsBullet.rsNavSelected span {
		background-color: ;
	}
/*  ==========================================================================
	@ GRADIENT
	========================================================================== */
	.gradient {
		background: #ffffff;
		background: linear-gradient(138deg, #ffffff 0%, #ffffff 57%, #ffffff 100%);
	}

/*  ==========================================================================
	@ SHADOW
	========================================================================== */
	.shadow_text {
		text-shadow: 0px 1px 2px rgba(150, 150, 150, 0.1);
	}
	.shadow_box {
		box-shadow: 0 4px 8px 0 rgba(0,0,0,0.1), 0 4px 8px 0 rgba(0,0,0,0.1) !important;
	}
/*  ==========================================================================
	@ ROUND
	========================================================================== */
	.round_3 {
		position:relative;
		border-radius:3px;
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
		overflow:hidden;
	}
	.round_top_3 {
		position:relative;
		border-radius:3px 3px 0px 0px;
		-moz-border-radius:3px 3px 0px 0px;
		-webkit-border-radius:3px 3px 0px 0px;
		overflow:hidden;
	}
	.round_bottom_3 {
		position:relative;
		border-radius:0px 0px 3px 3px;
		-moz-border-radius:0px 0px 3px 3px;
		-webkit-border-radius:0px 0px 3px 3px;
		overflow:hidden;
	}
	.round_5 {
		position:relative;
		border-radius:5px;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
		overflow:hidden;
	}
	.round_10 {
		position:relative;
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
		overflow:hidden;
	}
	.round_20 {
		position:relative;
		border-radius:20px;
		-moz-border-radius:20px;
		-webkit-border-radius:20px;
		overflow:hidden;
	}
	.round_60 {
		position:relative;
		border-radius:60px;
		-moz-border-radius:60px;
		-webkit-border-radius:60px;
		overflow:hidden;
	}
	.round_circle {
		position:relative;
		border-radius:50%;
		-moz-border-radius:50%;
		-webkit-border-radius:50%;
		overflow:hidden;
	}
/*  ==========================================================================
	@ TRANSITION
	========================================================================== */
	.ts_all {
		-webkit-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
		-moz-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
		-o-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000);
		transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1.000); /* easeInOutCubic */

		-webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
		-moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
		-o-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
		transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000); /* easeInOutCubic */
	}
/*  ==========================================================================
	@ HELPER
	========================================================================== */
	ul:before,
	ul:after,
	li:before,
	li:after,
	dl:before,
	dl:after,
	dd:before,
	dd:after,
	fieldset:before,
	fieldset:after,
	.container:before,
	.container:after,
	.row:before,
	.row:after,
	.col_group:before,
	.col_group:after,
	.clear:before,
	.clear:after {
		display:table;
		content:" ";
	}
	ul:after,
	li:after,
	dl:after,
	dd:after,
	fieldset:after,
	.container:after,
	.row:after,
	.col_group:after,
	.clear:after {
		clear:both;
	}

/*  ==========================================================================
	@ CHAT.CSS
	========================================================================== */
	html,body {
		font-size:13px;
		width:100%;
		height:100%;
		overflow:hidden;
		background-color:#eff1f6;
	}
	h1 span,
	h2 span,
	h3 span,
	h4 span,
	h5 span,
	h6 span,
	p span {
		/*color:;*/
	}
	i {
		font-size:20px;
	}



/*  ==========================================================================
	@ BUTTON
	========================================================================== */
	.btn_color_1 {
		color:#ffffff !important;
		background-color:#474cff;
	}
	.btn_color_2 {
		color:#ffffff !important;
		background-color:#474cff;
	}
	.btn_color_3 {
		color:#ffffff !important;
		background-color:#555555;
	}
	.btn_color_4 {
		color:#ffffff !important;
		background-color:#aaaaaa;
	}
	.btn_color_5 {
		color: '#444444' !important;
		background-color:#ffffff;
	}
	.btn_color_6 {
		color:#474cff !important;
		background-color:#ffffff;
	}
	.btn_sm {
		padding:3px 6px;
	}
	.btn_sm i {
		font-size:10px;
		margin-right:5px;
	}
	.btn_md {
		font-size:13px;
		padding:5px 10px;
	}
	.btn_md i {
		font-size:10px;
		margin-right:10px;
	}
	.btn_lg {
		font-size:13px;
		padding:10px;
	}
	.btn_lg i {
		font-size:15px;
		margin-right:10px;
	}

    	.btn_full {
        display: block;
        width: 100%;
        font-size: 13px;
        text-align: center;
        padding: 10px 0;
        margin-left: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    




	.btn_full i {
		position:absolute;
		top:50%;
		right:0;
		font-size:15px;
		transform:translateY(-50%);
		
	}
	.arrow {
		width:200px;
	}
	.arrow i {
		position:absolute;
		top:50%;
		right:0;
		transform:translateY(-50%);
	}
/*  ==========================================================================
	@ CHAT
	========================================================================== */
    #chat {
        position:absolute;
        width:100%;
        height:100%;
        background-color:#f7f7f7;
        overflow:hidden;
		
		opacity:0;
		transform:scale(0.75);
    }


    /* HEADER */
	#chat #header {
		position:absolute;
		top:0;
		width:100%;
		z-index:3;
		background:#fff;
    }

	#chat #header2 {
		top:0;
		width:100%;
		z-index:3;
        text-align: center;
    }

	#chat #header .ui_holder {
		/*height:90px;*/
		height:60px;
		color:#ffffff;
		line-height:60px;
	}

	#chat #header .ui_holder a .ico_ui_nav{
		width:25px;
	}

	#chat #header .ui_holder .ui_right span {
		display:inline-block;
		line-height:normal;
	}
	#chat #header .ui_holder a {
		color:#ffffff;
	}
    #chat #header .ui_holder .profile_holder .img {
        float:left;
        margin-right:10px;
    }
    #chat #header .ui_holder .profile_holder .img img {
        margin-top: 6px;
        height:45px;
    }
    #chat #header .ui_holder .profile_holder .name {
        float:left;
        font-size:20px;
		font-weight:bold;
        color:#000000;
    }
    /* HEADER ANIMATION */
    #chat #header.active {
    }
	#chat #header.active .ui_holder {
		height:60px;
		line-height:60px;
	}
    #chat #header.active .ui_holder .profile_holder .img img {
        height:35px;
    }
    #chat #header.active .ui_holder .profile_holder .name {
        font-size:16px;
        color:#ffffff;
    }
    /* MAIN */
    #chat #main {
        position:absolute;
        width:100%;
        top:60px;
        bottom:50px;
		z-index:1;
    }




    


    #chat #main #talk {
        position:absolute;
        width:100%;
        height:100%;
        background-color:#f7f7f7;
        overflow-x:hidden;
        overflow-y:scroll;
        padding-bottom:15px;
    }

    

    #chat #main #talk .talk_body .view_date {
        display:block;
		width:55%;
		color: #fff;
        /* color:#ffffff; */
        font-size: 14px;
        text-align:center;
        font-weight:300;
        padding: 4px 0;
		border:1px solid #c4c9d1;
        background-color:#c4c9d1;
        /* background-color:#555555; */
        margin: 15px auto 0 auto;
    }



	#chat #main #talk .talk_body .view_date2 {
        display: block;
		width:55%;
        color: #ababab;
        font-size: 14px;
        text-align: center;
		font-weight:300;
        padding: 4px 0;
		border:1px solid #c4c9d1;
		background-color:#fff;
        /* background-color:#555555; */
        margin: 15px auto 0 auto;
	}








    #chat #main #talk #more_txt {
    	font-weight:bold;
    	color:#000;
    	text-decoration: underline;
    }
    /* ANSWER COMMON */
    #chat #main #talk .talk_body .ans {
        position:relative;
    }
    #chat #main #talk .talk_body .ans .messages .message {
        position:relative;
        margin-bottom:5px;
    }
    #chat #main #talk .talk_body .ans .messages .message .text {
        position:relative;
        display:inline-block;
        text-align:left;
        word-break:break-all;
        max-width:75%;
        padding:10px;
    }

	/*추가작업*/
    #chat #main #talk .talk_body .ans .messages .message .tts {
        display:inline-block;
        font-size:12px;
        font-weight:bold;
        margin-bottom:20px;
        height:20px;
        vertical-align:bottom;
    }
    #chat #main #talk .talk_body .ans .messages .message .time {
        display:inline-block;
        font-size:12px;
        font-weight:normal;
        margin-bottom:5px;
        vertical-align:bottom;
    }
    #chat #main #talk .talk_body .ans .messages .message .btn_holder li {
        margin-top:5px;
    }
	#chat #main #talk .talk_body .ans .messages .message .btn_holder li a {
        /* width:240px; */
		color:#28388f;
		background-color:#dee7fb;
		padding-right: 20px;

		/*
        color:#000000;
        background-color:#ebebeb;
		*/
    }

	/* 처음으로/상담종료 버튼 */
	#chat #main #talk .talk_body .ans .messages .message .btn_holder li a.btn_reset { width:auto; line-height:19px; padding:5px 8px 6px 31px; margin:0 3px 0 0; border:1px solid #12298c; background:transparent; border-radius:18px; }
	#chat #main #talk .talk_body .ans .messages .message .btn_holder li a.btn_reset span { display:inline-block; }
	#chat #main #talk .talk_body .ans .messages .message .btn_holder li a.btn_reset i { display:block; left:8px; width:19px; height:19px; vertical-align:middle; margin:0; background:url(/static/img/icon_ui_reset.png) no-repeat 50% 50%; }

	#chat #main #talk .talk_body .ans .messages .message .btn_holder li a.btn_exit { width:auto; line-height:19px; padding:5px 8px 6px 31px; border:1px solid #12298c; background:transparent; border-radius:18px; }
	#chat #main #talk .talk_body .ans .messages .message .btn_holder li a.btn_exit span { display:inline-block; }
	#chat #main #talk .talk_body .ans .messages .message .btn_holder li a.btn_exit i { display:block; left:8px; width:19px; height:19px; vertical-align:middle; margin:0; background:url(/static/img/icon_ui_exit.png) no-repeat 50% 50%; }

    /* CHATBOT */
    #chat #main #talk .talk_body .ans.left .profile {
		/*
        position:absolute;
        vertical-align:top;
        margin-right:5px;
		*/
		 border-radius:0 !important;
    }
    #chat #main #talk .talk_body .ans.left .profile img {
        width:40px;
    }
    #chat #main #talk .talk_body .ans.left .messages {
        /* margin-left:45px; */
        margin-top:4px;
        vertical-align:top;
    }
    #chat #main #talk .talk_body .ans.left .messages .message .text {
        /*
		color:#000000;
        background-color:#ebebeb;
		*/
		color:#727272;
		background-color:#fff;
        margin-right:5px;

        border-radius:0px 10px 10px 10px;
		-moz-border-radius:0px 10px 10px 10px;
		-webkit-border-radius:0px 10px 10px 10px;
        overflow:hidden;
        line-height: 18px;
    }
	#chat #main #talk .talk_body .ans.left .messages .message .text b {
		color:#006ae8;
		font-weight:500;
	}
	#chat #main #talk .talk_body .ans.left .messages .message .btn_holder {
		position:relative;
        /*display:inline-block;*/
        text-align:left;
        word-break:break-all;
        max-width:80%;
        padding:5px;
		margin-top:4px;
		/*background:#fff;*/
		border-radius:0px 10px 10px 10px;
		-moz-border-radius:0px 10px 10px 10px;
		-webkit-border-radius:0px 10px 10px 10px;
	}
    /* PERSON */
	#chat #main #talk .talk_body .ans.right {
        margin:12px 4% 0 0;
    }
    #chat #main #talk .talk_body .ans.right .messages {
        text-align:right;
    }
    #chat #main #talk .talk_body .ans.right .messages .message .text {
        color:#000000;
        background-color:#ebebeb;
        margin-left:5px;

        border-radius:10px 0px 10px 10px;
        -moz-border-radius:10px 0px 10px 10px;
        -webkit-border-radius:10px 0px 10px 10px;
        overflow:hidden;
    }
    /* FOOTER */
    #chat #footer {
        position:fixed;
        bottom:0;
        left:0;
        width:100%;
		padding:0 4% 0 0;
		background-color:#ffffff;
        /* background-color:#f7f7f7; */
        z-index:2;
    }
    #chat #footer .ui_holder {
        padding:12px 0 12px 0;
    }
	#chat #footer .ui_holder .col_group { display:flex; flex-wrap: nowrap; justify-content: space-between; width:100%; }
	#chat #footer .ui_holder .col_group:before { display:initial; }
    #chat #footer .ui_holder .col_group div:nth-child(1) {
        /*float:left;
		 margin-top: -5px;*/
        width:32px;
       
    }
    #chat #footer .ui_holder .col_group div:nth-child(3) {
        /*float:right;*/
        width:32px;
        /*margin-top: 5px;*/
    }
    #chat #footer .ui_holder .col_group div:nth-child(2) {
		position:relative;
        padding:0 4px;
		width:calc(100% - 64px);
    }
	#chat #footer .ui_holder .col_group div:nth-child(2) button {
		position:absolute;
		top:3px;
		left:7px;
		width:27px;
		height:27px;
		color:#555555;
		z-index:2;
		border-radius:14px;
	}
	#chat #footer .ui_holder .col_group div:nth-child(2) button.mic_active {
		color:#fff;
		z-index:2;
		background: linear-gradient(45deg, #5151e5, #72edf2);
		
	}
    #chat #footer .ui_holder #quick_slider_open {
        /*color:;
		line-height:32px;*/
		color:#12298c;
		width:32px;
		height:32px;
        
		border:1px solid #12298c;
		border-radius:16px;
		 -moz-border-radius:16px;
        -webkit-border-radius:16px;
    }
    #chat #footer .ui_holder input#talkText {
        width:100%;
		border:1px solid #e0e0e0;
        background-color:#fff !important;
        padding:8px 16px 8px 30px;
		border-radius:16px;
		 -moz-border-radius:16px;
        -webkit-border-radius:16px;
    }
	#chat #footer .ui_holder input#talkText::placeholder { color:#b8b8b8; }
    #chat #footer .ui_holder #send {
        /*
		color:;
        line-height:36px;
		*/
		color:#fff;
		width:32px;
		height:32px;
        
		border:1px solid #12298c;
		background-color:#12298c;
		border-radius:16px;
		 -moz-border-radius:16px;
        -webkit-border-radius:16px;
    }
	#chat #footer .ui_holder #send i { margin:0 0 0 -3px; }
    #chat #footer #quick_slider li {
        margin-bottom:10px;
        
    }
    #chat #footer #quick_slider {
        position:relative;
        width:100%;
        height:112px;
    }

	/* 마이크활성화표시 */
	.mic_ripple { position:absolute; left:-10px; top:-13px; width:60px; height:60px; z-index:1; }
	.mic_ripple .mic_circle { position:absolute !important; width:100% !important; height:100%; padding:0 !important; z-index:1; background-color:dodgerblue; border-radius:50%; opacity:0; animation: growAndFade 900ms infinite ease-out; }
	.mic_ripple .mic_ripple1 { animation-delay:300ms; }
	.mic_ripple .mic_ripple2 { animation-delay:600ms; }
	.mic_ripple .mic_ripple3 { animation-delay:900ms; }
	@keyframes growAndFade {
	  0% {
		opacity: .25;
		transform: scale(0);
	  }
	  100% {
		opacity: 0;
		transform: scale(1);
	  }
	}
/*  ==========================================================================
	@ LOADING
	========================================================================== */
	.loading:before{
		content:"";
		position:absolute;
		top:0px;
		left:-10px;
		height:4px;
		width:4px;
		border-radius:4px;
		-webkit-animation:loader10g 1200ms ease-in-out infinite;
				animation:loader10g 1200ms ease-in-out infinite;
	}

	.loading {
		position: relative;
		width:4px;
		height:4px;
		top:50%;
		left:0%;
		margin:5px 10px;
		border-radius:4px;
		-webkit-animation:loader10m 1200ms ease-in-out infinite;
				animation:loader10m 1200ms ease-in-out infinite;
	}
	.loading:after{
		content:"";
		position:absolute;
		top:0px;
		left:10px;
		height:4px;
		width:4px;
		border-radius:4px;
		-webkit-animation: loader10d 1200ms ease-in-out infinite;
				animation: loader10d 1200ms ease-in-out infinite;
	}

	@-webkit-keyframes loader10g{
		0%{background-color: ;}
		25%{background-color: 9c;}
		50%{background-color: ;}
		75%{background-color: ;}
		100%{background-color: ;}
	}
	@keyframes loader10g{
		0%{background-color: ;}
		25%{background-color: 9c;}
		50%{background-color: ;}
		75%{background-color: ;}
		100%{background-color: ;}
	}

	@-webkit-keyframes loader10m{
		0%{background-color: ;}
		25%{background-color: 9c;}
		50%{background-color: ;}
		75%{background-color: ;}
		100%{background-color: ;}
	}
	@keyframes loader10m{
		0%{background-color: ;}
		25%{background-color: 9c;}
		50%{background-color: ;}
		75%{background-color: ;}
		100%{background-color: ;}
	}

	@-webkit-keyframes loader10d{
		0%{background-color: ;}
		25%{background-color: 9c;}
		50%{background-color: ;}
		75%{background-color: ;}
		100%{background-color: ;}
	}
	@keyframes loader10d{
		0%{background-color: ;}
		25%{background-color: 9c;}
		50%{background-color: ;}
		75%{background-color: ;}
		100%{background-color: ;}
	}
/*  ==========================================================================
	@ UI HOLDER
	========================================================================== */	
	.ui_holder {
		position:relative;
		display:flex; flex-wrap: nowrap; justify-content: space-between; width:100%; padding:16px 0 0 0;
		/* text-align:center; */
	}
	.ui_holder .ui_left {
		/*position:absolute;
		top:50%;
		left:0;

		transform:translateY(-50%);
		*/
	}
	.ui_holder .ui_right {
	/*
		position:absolute;
		top:50%;
		right:0;

		transform:translateY(-20%);
	*/
	}




/*  ==========================================================================
	@ 슬라이드 이미지
	========================================================================== */	
 

.message_balloon_wrap{
	background-color:#fff;	
  border-radius: 1em 1em 1em 1em;
}
  .goods_images {
    overflow: hidden;
    position: relative;
   /* background-color: #d8d8d8;*/
    text-align: center;
 		border-radius: 1em 1em 0em 0em;
}
		
  .message_balloon .contents_area {
    display: block;
    overflow: hidden;
    position: relative;
    padding: 12px 14px;
    background: #fff;
    word-break: break-all;
 	  border-radius: 1em 1em 1em 1em;
}
  .message_balloon .con_composite {
    font-size: 14px;
    line-height: 1.5;
}
.list_btn {
    max-height: 410px;
    overflow: hidden;
    position: relative;
    background-color: #eeeeee;
    width: 200px;
    border-radius: 0em 0em 1em 1em;
}
.list_btn a {
    display: block;
    overflow: hidden;
    padding: 13px 20px 11px;
    border-top: 1px solid #eee;
    background-color: #fff;
    font-size: 13px;
    font-weight: 600;
    color: #466dfc;
    line-height: 1.2;
    text-align:center;
}




.btn-color {
  color: #ffffff;
  background-color: #474cff;
  border-color: #474cff;
}

 .btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}




.slide_btn {
    /*background:#eeeeee !important;*/
    text-align: center;
}
.slide_btn img{width:100px;}
 

.fixed_option_box.close {

	transform:translateY(0);
	-ms-transform:translateY(0);
	-moz-transform:translateY(0);
	-webkit-transform:translateY(0);
	-o-transform:translateY(0);

	transition: all .0s;
	-moz-transition: all .0s;
	-webkit-transition: all .0s;
	-o-transition: all .0s;

}
.fixed_option_box {
	bottom: 33px;
    left:0; width:100%; z-index:99997;
	transform:translateY(120%);
	-ms-transform:translateY(120%);
	-moz-transform:translateY(120%);
	-webkit-transform:translateY(120%);
	-o-transform:translateY(120%);
	transition: all .2s;
	-moz-transition: all .2s;
	-webkit-transition: all .2s;
	-o-transition: all .2s;
}



.footbtn {
    display: block;
    position: absolute;
    top: 33px;
    left: 50%;
    width: 104px;
    height: 26px;
    margin-left: -52px;
    border-radius: 8px 8px 0 0;
    color: #fff;
    font-size: 12px;
    line-height: 26px;
    text-align: center;
}


.box {
    position: relative;
    border-radius: 3px;
    background: #ffffff;
    border-top: 3px solid #d2d6de;

    width: 100%;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

.box-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    padding: 10px;
}


.btn-default.active.focus, .btn-default.active:focus, .btn-default.active:hover, .btn-default:active.focus, .btn-default:active:focus, .btn-default:active:hover, .open>.dropdown-toggle.btn-default.focus, .open>.dropdown-toggle.btn-default:focus, .open>.dropdown-toggle.btn-default:hover {
    color: #333;
    background-color: #d4d4d4;
    border-color: #8c8c8c;
}
.btn-default:hover, .btn-default:active, .btn-default.hover {
    background-color: #e7e7e7;
}
.btn:active {
    -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
    -moz-box-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
    box-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
}
.btn-default.active, .btn-default:active, .open>.dropdown-toggle.btn-default {
    color: #333;
    background-color: #e6e6e6;
    background-image: none;
    border-color: #adadad;
}
.btn-default:hover {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad;
}

.btn.focus, .btn:focus, .btn:hover {
    color: #333;
    text-decoration: none;
}

.btn-slide {
    border-radius: 3px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid transparent;
}
.btn-block {
    display: block;
    width: 100%;
}

.btn-slide {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
	padding: 6px 12px;
}
.btn-block+.btn-block {
    margin-top: 5px;
}
.btn-default {
    background-color: #474cff;
    color:#ffffff;
    /*border-color: #ddd;*/
}






.header_img{
    width: 150px;
    position: absolute;
    left: 50%;
    top: 50px;
    transform: translate(-50%,-100%);
    z-index: 99;
}




.popup_check_wrap{
	background-color:rgba(0,0,0,0.7);
	width:100%;
	position:absolute;
	top:0;
	z-index:999;
	max-width:720px;
	margin:0 auto;
}

.popup_logout_wrap{
	background-color:rgba(0,0,0,0.7);
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	z-index:999;
	/*max-width:720px;*/
	margin:0 auto;
}


.popup_check_box{
	height:80%;
	display:table;
	width:100%;
}


.popup_check_box2{
	display:table;
	width:100%;
    position: absolute;
    bottom: 18% ;
}


.popup_check{
	display:table-cell;
	vertical-align:middle;
	width:100%;
}
.pop_wrap{
	max-width: 320px;
	margin: 0 auto;
	box-sizing: border-box;
	font-size:12px;
	border-radius:12px;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
}
.pop_top_txt{
	position:relative;
	font-size: 16px;
	text-align: left;
    line-height: 35px;
    box-sizing: border-box;
    padding:12px 16px 12px 16px;
    color: #fff;
	background: #474cff;
	-webkit-border-top-left-radius: 12px;
	-webkit-border-top-right-radius: 12px;
	-moz-border-radius-topleft: 12px;
	-moz-border-radius-topright: 12px;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
	
	
}
.pop_del_df{
	display:block;
	position:absolute;
	right:16px;
	top:12px;
	width:16px;
	height:16px;
	box-sizing: border-box;
}
.pop_del_df i{
	color:#fff;
	font-size:16px;
}

.pop_del_df svg{
	width: 15px;
    vertical-align:middle;
}
.pop_del_df img{
	width: 16px;
    vertical-align:middle;
	/* margin-bottom:10px; */
}
.pop_del_df .close{
	fill:#fff;	
}
.pop_middle_txt{
	display:block;
	text-align:center;
	background:#eff1f6;
	color:#333333;
	padding:16px 16px 16px 16px;
}

.pop_middle_sm_txt{
	color:#333333;
	font-size:13px;
	text-align:center;
	line-height: 25px;
}
.pop_middle_sm_txt p{
	color:#333333;
	font-size:13px;
	text-align:center;
	line-height: 25px;
}
.pop_middle_sm_txt h3{
	font-size: 18px;
	margin-top: 5px;
	margin-bottom: 0px;
	line-height: 26px;
}
.pop_middle_sm_txt h4{
	color:#ed1b23;
	font-size:15px;
	font-weight:bold;
	margin-bottom: 0px;
	line-height: 25px;
}
.pop_inline{
	/* width:42%; */
	position:relative;
	display:block;
	text-align:center;
	vertical-align: top;
}
.pop_inline textarea { width:100%; font-size:14px; line-height:1.35; padding:8px; border:1px solid #d2d2d2; background:#fff; border-radius:4px; }
.pop_inline #memo_txt_cnt { position:absolute; bottom:0; width:100%; line-height:1.5; font-size:13px; text-align:right; padding:4px 8px 4px 8px; }
.pop_inline #memo_txt_cnt strong { color:#474cff; font-weight:500; }
.pop_inline img{
	width:60%;
}
.popup_check .pop_bottom_btn a{
	width:47%;
	display:inline-block;
	padding:12px 0px;
	box-sizing:border-box;
	text-align:center;
}
.cancel_left{
	border-radius: 3px;
    width: 85%;
	background-color:#ddd;
	color:#666;
}

.ok_right{
	border-radius: 3px;
    width: 90%;
	background-color: #ed1b23;
	color: #ffffff;
}
.pop_bottom_btn{
	background:#f1f1f1;
	padding:0 16px 16px 16px;
	height:auto;
	/* border-top:1px solid #dadada; */ 
	text-align:center;
	-webkit-border-bottom-right-radius: 16px;
	-webkit-border-bottom-left-radius: 16px;
	-moz-border-radius-bottomright: 16px;
	-moz-border-radius-bottomleft: 16px;
	border-bottom-right-radius: 16px;
	border-bottom-left-radius: 16px;
}
.pop_bottom_btn button { width:100%; color:#ffffff; background:#474cff; border-radius:4px; }
.pop_middle_txt .modal_img {
	margin-left:20px;
	padding:10px 10px;
	vertical-align:middle;
}
.modal_img {
	max-width: 40%;
	margin-bottom: 10px;
	}
.clearfix{
	content:"";
	display:block;
	clear:both;
}
 
/* 만족, 신고 */
.message .btn_holder .btn_color_2 { /* width: 33.33333333%; */ margin-top: 10px; margin-right:4px; margin-bottom:10px; padding:4px 8px 2px 8px; font-size:14px; background:#c4c9d1; border-radius:13px; }
.message .btn_holder .btn_c_thumb.active { background:#474cff; }
.message .btn_holder .btn_c_report.active { background:#474cff; }
.message .btn_holder .btn_color_2 i { font-size:16px; margin-right:4px; line-height:1.2; }

/* 인사말카드 */
.swiper-card { height:216px; margin-bottom:30px; }
.swiper-card .swiper-slide { width:240px !important; }
.swiper-card .goods_images { width:240px; height:80px; border-radius:0em 1em 0em 0em; background: linear-gradient(45deg, #7367f0, #ce9ffc); }
.swiper-card .swiper-slide01 .goods_images { background: linear-gradient(45deg, #7367f0, #ce9ffc); }
.swiper-card .swiper-slide02 .goods_images { background: linear-gradient(45deg, #32ccbc, #90f7ec); }
.swiper-card .swiper-slide03 .goods_images { background: linear-gradient(45deg, #ea5455, #feb692); }
.swiper-card .swiper-slide04 .goods_images { background: linear-gradient(45deg, #0396ff, #abdcff); }
.swiper-card .swiper-slide05 .goods_images { background: linear-gradient(45deg, #28c76f, #81fbb8); }
.swiper-card .goods_images span { display:block; width:240px; height:80px; color:#fff; font-weight:500; font-size:16px; text-align:left; padding:30px 0 0 10px; }
.swiper-card .goods_images span { background:url(/static/img/bg-pattern01.png) right 50%; }
.swiper-card .list_btn { width:auto; height:136px; padding:0 10px 10px 10px; background:#fff; }
.swiper-card .list_btn li { margin:10px 0 0 0; }
.swiper-card .list_btn .btn_full { color:#727272 !important; padding:8px 0 9px 0; background:#f0f2f7; border-radius:16px; }
.swiper-card .swiper-pagination { bottom:-30px !important; }
.swiper-card .swiper-pagination .swiper-pagination-bullet-active { width:30px; border-radius:4px; background-color:#12298c;}
.swiper-card .swiper-pagination .swiper-pagination-bullet:last-child { /* display:none; */ }
#chat #footer #quick_slider .btn_full { border-radius:18px; }

/* 공지사항 */
#main .sm_notice { position:relative; height:32px; line-height:32px; color:#fff; background:#12298c; }
#main .sm_notice a { position:relative; display:block; height:auto; color:#fff; text-decoration:none; }
#main .sm_notice a:before {	display:block; width:24px; height:24px; position:absolute; top:4px; right:12px; text-align:center; font-family:'icomoon'; content:"\e915"; color:#fff; font-size:16px; line-height:24px; }
#main .sm_notice a.active:before {	content:"\e902"; }
#main .sm_notice a dt { padding:0 36px 0 38px; background:url(/static/img/bg_notice_bullhorn.png) no-repeat 16px 9px; }
#main .sm_notice a dd { display:none; position:absolute; left:0; top:32px; width:100%; /*height:300px;*/ color:#12298c; font-size:14px; line-height:20px; padding:16px; border:1px solid #12298c; border-top:none; background:#fff; z-index:10; }
#main .sm_notice a.active dd { display:block; }
#main .sm_notice a dd p { color:#12298c; font-size:14px; line-height:20px; padding:0; }

.responseWrap { display:none; border:1px solid #fff; font-size:12px; /*text-align:center; overflow:hidden; overflow-y:auto; margin:0 7px;  */}
.responseWrap.on { display:block; }
.responseWrap .responInfo { padding:10px 15px 0px; line-height:140%; }
.responseWrap .responInfo .time { margin-bottom:5px;}
.responseWrap .time {  }
.responseWrap .price { letter-spacing:-0.5px; vertical-align:middle; }
.responseWrap .startEndTime { width:100%; margin:10px 0px 15px; table-layout:fixed; }
.responseWrap .startEndTime th { padding:8px 0px; background:#fff; color:#000; border:1px solid white; }
.responseWrap .startEndTime td { padding:8px 0px; border:1px solid white; }

.responseWrap .responContents { text-align:left; margin:0 15px; overflow:hidden; border-top:1px dotted #CCC; padding-top:15px; }
.responseWrap .responContents .etc { margin-bottom:15px; padding-left:0px; text-align:center }
.responseWrap .responContents .etc span { font-weight:bold; }
.responseWrap .responContents ul { overflow:hidden; overflow-y:auto; margin-bottom:10px; }

.responseWrap li p,
.responseWrap li { background-position:14px 0; background-repeat:repeat-y; }
.responseWrap .train1 .start,
.responseWrap .train1 .text { background-image:url(/subway/img/tranBg01.png); }
.responseWrap .train2 .start,
.responseWrap .train2 .text { background-image:url(/subway/img/tranBg02.png); }
.responseWrap .train3 .start,
.responseWrap .train3 .text { background-image:url(/subway/img/tranBg03.png); }
.responseWrap .train4 .start,
.responseWrap .train4 .text { background-image:url(/subway/img/tranBg04.png); }
.responseWrap .train5 .start,
.responseWrap .train5 .text { background-image:url(/subway/img/tranBg05.png); }
.responseWrap .train6 .start,
.responseWrap .train6 .text { background-image:url(/subway/img/tranBg06.png); }
.responseWrap .train7 .start,
.responseWrap .train7 .text { background-image:url(/subway/img/tranBg07.png); }
.responseWrap .train8 .start,
.responseWrap .train8 .text { background-image:url(/subway/img/tranBg08.png); }
.responseWrap .train9 .start,
.responseWrap .train9 .text { background-image:url(/subway/img/tranBg09.png); }
.responseWrap .trainI .start,
.responseWrap .trainI .text { background-image:url(/subway/img/tranBg10.png); }
.responseWrap .trainI2 .start,
.responseWrap .trainI2 .text { background-image:url(/subway/img/tranBg11.png); }
.responseWrap .trainB .start,
.responseWrap .trainB .text { background-image:url(/subway/img/tranBg12.png); }
.responseWrap .trainS .start,
.responseWrap .trainS .text { background-image:url(/subway/img/tranBg13.png); }
.responseWrap .trainK .start,
.responseWrap .trainK .text { background-image:url(/subway/img/tranBg14.png); }
.responseWrap .trainA .start,
.responseWrap .trainA .text { background-image:url(/subway/img/tranBg15.png); }
.responseWrap .trainG .start,
.responseWrap .trainG .text { background-image:url(/subway/img/tranBg16.png); }
.responseWrap .trainSU .start,
.responseWrap .trainSU .text { background-image:url(/subway/img/tranBg17.png); }
.responseWrap .trainU .start,
.responseWrap .trainU .text { background-image:url(/subway/img/tranBg18.png); }
.responseWrap .trainE .start,
.responseWrap .trainE .text { background-image:url(/subway/img/tranBg19.png); }
.responseWrap .trainKK .start,
.responseWrap .trainKK .text { background-image:url(/subway/img/tranBg20.png); }
.responseWrap .trainW .start,
.responseWrap .trainW .text { background-image:url(/subway/img/tranBg21.png); }
.responseWrap .trainSH .start,
.responseWrap .trainKP .start,
.responseWrap .trainKP .text { background-image:url(/subway/img/tranBg23.png); }

.responseWrap .start,
.responseWrap .text,
.responseWrap .end { padding-left:40px; letter-spacing:-1px; }
.responseWrap .text { padding-top:5px; padding-bottom:5px; }

.responseWrap .start > *,
.responseWrap .text > *,
.responseWrap .end > * { vertical-align:middle; }
/* .responseWrap .bullet,
.responseWrap .eBullet { display:inline-block; width:25px; height:25px; line-height:25px; text-align:center; text-indent:0px; margin-right:10px; border-radius:5px; font-weight:bolder; } */
.responseWrap p.start:before,
.responseWrap p.end:before { display:inline-block; width:30px; height:30px; line-height:30px; text-align:center; text-indent:0px; margin-right:10px; border-radius:5px; font-weight:normal; color:white;  margin-left: -40px; vertical-align:middle }
.responseWrap p.end:before { content:"하차" }


.responseWrap .text span { display:block; font-weight:normal; letter-spacing:-1px; word-spacing:2px; line-height:130%; color:#999; }
.responseWrap strong { font-weight:700; display:inline-block; max-height:30px; text-overflow:ellipsis; overflow:hidden; }
.responseWrap strong span { font-weight:normal; }

.responseWrap .train1 p.start:before { content:"1" }
.responseWrap .train1 p:before {  background:#08308f; }
.responseWrap .train2 p.start:before { content:"2" }
.responseWrap .train2 p:before {  background:#0ea349; }
.responseWrap .train3 p.start:before { content:"3" }
.responseWrap .train3 p:before {  background:#f08302; }
.responseWrap .train4 p.start:before { content:"4" }
.responseWrap .train4 p:before {  background:#00a5df; }
.responseWrap .train5 p.start:before { content:"5" }
.responseWrap .train5 p:before {  background:#a14a9b; }
.responseWrap .train6 p.start:before { content:"6" }
.responseWrap .train6 p:before {  background:#d09012; }
.responseWrap .train7 p.start:before { content:"7" }
.responseWrap .train7 p:before {  background:#627535; }
.responseWrap .train8 p.start:before { content:"8" }
.responseWrap .train8 p:before {  background:#e84e72; }
.responseWrap .train9 p.start:before { content:"9" }
.responseWrap .train9 p:before {  background:#c0931c; }
.responseWrap .trainI p.start:before {  content:"인천"; } /* 인천1호 */
.responseWrap .trainI p:before {  background:#669cdc; }
.responseWrap .trainI2 p.start:before {  content:"인천2"; font-size:8px; letter-spacing:-2px } /* 인천2호 */
.responseWrap .trainI2 p:before {  background:#f39905; }
.responseWrap .trainB p.start:before {  content:"분당"; } /* 분당 */
.responseWrap .trainB p:before {  background:#fad50a; }
.responseWrap .trainS p.start:before {  content:"신분당"; font-size:8px; letter-spacing:-2px } /* 신분당 */
.responseWrap .trainS p:before {  background:#c82631; }
.responseWrap .trainK p.start:before {  content:"경의"; } /* 경의중앙 */
.responseWrap .trainK p:before {  background:#73c7a6; }
.responseWrap .trainA p.start:before {  content:"공항"; } /* 공항철도 */
.responseWrap .trainA p:before {  background:#238092; }
.responseWrap .trainG p.start:before {  content:"경춘"; } /* 경춘선 */
.responseWrap .trainG p:before {  background:#33C7A7; }
.responseWrap .trainSU p.start:before {  content:"수인"; } /* 수인선 */
.responseWrap .trainSU p:before {  background:#f9c001; }
.responseWrap .trainU p.start:before {  content:"의정부"; font-size:8px; letter-spacing:-2px} /* 의정부경전철 */
.responseWrap .trainU p:before {  background:#f5b800; }
.responseWrap .trainE p.start:before {  content:"용인"; } /* 용인경전철 */
.responseWrap .trainE p:before {  background:#308937; }
.responseWrap .trainKK p.start:before {  content:"경강"; } /* 경강선 */
.responseWrap .trainKK p:before {  background:#004a96; }
.responseWrap .trainW p.start:before {  content:"우이"; } /* 우이산설경전철 */
.responseWrap .trainW p:before {  background:#b7b7b7; }
.responseWrap .trainSH p.start:before {  content:"서해"; } /* 서해선 */
.responseWrap .trainSH p:before {  background:#8be800; }
.responseWrap .trainKP p.start:before {  content:"김포"; } /* 김포골드라인 */
.responseWrap .trainKP p:before {  background:#dbc57d; }

.responseWrap .switch,
.responseWrap .stop { line-height:140%; padding: 20px 0 20px 50px; color:#bbb; background-image:url(/subway/img/tranBgSwitch_light.png); }
.responseWrap .switch,
.responseWrap .stop,
.responseWrap .end { background-image:url(/subway/img/tranBgSwitch_light.png);  } 

.responseWrap.en p.end:before { content:"Off" }
.responseWrap.en .trainI p.start:before { content:"I"; } /* 인천1호 */
.responseWrap.en .trainI2 p.start:before { content:"I2"; font-size:12px; letter-spacing:0 } /* 인천2호 */
.responseWrap.en .trainB p.start:before { content:"B"; } /* 분당 */
.responseWrap.en .trainS p.start:before {  content:"SB"; font-size:12px; letter-spacing:0 } /* 신분당 */
.responseWrap.en .trainK p.start:before {  content:"G"; } /* 경의중앙 */
.responseWrap.en .trainA p.start:before {  content:"A"; } /* 공항철도 */
.responseWrap.en .trainG p.start:before {  content:"G"; } /* 경춘선 */
.responseWrap.en .trainSU p.start:before {  content:"S"; } /* 수인선 */
.responseWrap.en .trainU p.start:before {  content:"U"; font-size:12px; letter-spacing:0 } /* 의정부경전철 */
.responseWrap.en .trainE p.start:before {  content:"E"; } /* 용인경전철 */
.responseWrap.en .trainKK p.start:before {  content:"K"; } /* 경강선 */
.responseWrap.en .trainW p.start:before {  content:"W"; } /* 우이산설경전철 */
.responseWrap.en .trainSH p.start:before {  content:"SH"; } /* 서해선 */
.responseWrap.en .trainKP p.start:before {  content:"KP"; } /* 김포골드라인 */



.wayInfo .summary { overflow:hidden; }
.wayInfo .trainOrder { /* width:45%; */ float:left; }
.wayInfo .trainOrder li { margin-bottom:25px; font-size:14px; color:#000; font-weight:bold; padding-left:30px; overflow:hidden; }
.wayInfo .trainOrder li:before { width:25px; height:25px; margin-left:-30px; float:left; }
.wayInfo .trainOrder li * { vertical-align:middle; display:inline-block; line-height:140%; letter-spacing:-1px; }
.wayInfo .trainOrder li span { margin-top:3px; }
.wayInfo .trainOrder li .name { margin-right:10px; display:block; }
.wayInfo .trainOrder li .time { color:#444; float:right; font-size:12px; font-weight:normal; margin-left:15px; }



.wayInfo .firstLastTrain { width:100%; margin:10px 0px 20px; font: 12px;}
.wayInfo .firstLastTrain .mainTitle { color:#000; font-size:14px; background:#dfdfdf; padding:8px 0px; border-bottom:1px solid #ccc; border-right:1px solid #ccc; }
.wayInfo .firstLastTrain .mainTitle:last-child { border-right:0; }
.wayInfo .firstLastTrain .subTitle { color:#000; font-size:13px; background:#eee; padding:5px; border-right:1px solid #dfdfdf; }
.wayInfo .firstLastTrain tr:nth-child(3n+1) .subTitle { border-bottom:1px solid #dfdfdf }
.wayInfo .firstLastTrain td,
.wayInfo .firstLastTrain th { border-right:1px solid #dfdfdf; border-bottom:1px solid #eee; text-align:center; padding:5px 0px; color:#000; line-height:140%; }
.wayInfo .firstLastTrain th { font-weight:bold; }
.wayInfo .firstLastTrain td:last-child { border-right:0px; }



.wayInfo .summary { overflow:hidden; }
.wayInfo .trainOrder { width:45%; float:left; }
.wayInfo .trainOrder li { margin-bottom:25px; font-size:14px; color:#000; font-weight:bold; padding-left:30px; overflow:hidden; }
.wayInfo .trainOrder li:before { width:25px; height:25px; margin-left:-30px; float:left; }
.wayInfo .trainOrder li * { vertical-align:middle; display:inline-block; line-height:140%; letter-spacing:-1px; }
.wayInfo .trainOrder li span { margin-top:3px; }
.wayInfo .trainOrder li .name { margin-right:10px; display:block; }
.wayInfo .trainOrder li .time { color:#444; float:right; font-size:12px; font-weight:normal; margin-left:15px; }

.wayInfo .timePrice { width:55%; float:left; }
.wayInfo .timePrice td { padding:5px 0 }
.wayInfo .firstLastTrain { width:100%; margin:10px 0px 20px; }
.wayInfo .firstLastTrain .mainTitle { color:#000; font-size:14px; background:#dfdfdf; padding:8px 0px; border-bottom:1px solid #ccc; border-right:1px solid #ccc; }
.wayInfo .firstLastTrain .mainTitle:last-child { border-right:0; }
.wayInfo .firstLastTrain .subTitle { color:#000; font-size:13px; background:#eee; padding:5px; border-right:1px solid #dfdfdf; }
.wayInfo .firstLastTrain tr:nth-child(3n+1) .subTitle { border-bottom:1px solid #dfdfdf }
.wayInfo .firstLastTrain td,
.wayInfo .firstLastTrain th { border-right:1px solid #dfdfdf; border-bottom:1px solid #eee; text-align:center; padding:5px 0px; color:#000; line-height:140%; }
.wayInfo .firstLastTrain th { font-weight:bold; }
.wayInfo .firstLastTrain td:last-child { border-right:0px; }



.window {  }
.window .root li span { line-height:20px; }
.window .icon:before { content:""; display:inline-block; margin-right:5px; vertical-align:middle; width:20px; height:20px; background-position:center; background-repeat:no-repeat; background-size:100%; }

.window .train1:before { background-image:url('/subway/img/marker01.png') }
.window .train2:before { background-image:url('/subway/img/marker02.png') }
.window .train3:before { background-image:url('/subway/img/marker03.png') }
.window .train4:before { background-image:url('/subway/img/marker04.png') }
.window .train5:before { background-image:url('/subway/img/marker05.png') }
.window .train6:before { background-image:url('/subway/img/marker06.png') }
.window .train7:before { background-image:url('/subway/img/marker07.png') }
.window .train8:before { background-image:url('/subway/img/marker08.png') }
.window .train9:before { background-image:url('/subway/img/marker09.png') }
.window .trainI:before { background-image:url('/subway/img/marker10.png') }
.window .trainI2:before { background-image:url('/subway/img/marker11.png') }
.window .trainB:before { background-image:url('/subway/img/marker12.png') }
.window .trainS:before { background-image:url('/subway/img/marker13.png') }
.window .trainK:before { background-image:url('/subway/img/marker14.png') }
.window .trainA:before { background-image:url('/subway/img/marker15.png') }
.window .trainG:before { background-image:url('/subway/img/marker16.png') }
.window .trainSU:before { background-image:url('/subway/img/marker17.png') }
.window .trainU:before { background-image:url('/subway/img/marker18.png') }
.window .trainE:before { background-image:url('/subway/img/marker19.png') }
.window .trainKK:before { background-image:url('/subway/img/marker20.png') }
.window .trainW:before { background-image:url('/subway/img/marker21.png') }
.window .trainSH:before { background-image:url('/subway/img/marker22.png') }
.window .trainKP:before { background-image:url('/subway/img/marker23.png') }
.window .popupContents .title { color:#000; font-size:13px; border-bottom:1px solid #bfbfbf; margin-bottom:8px; padding:10px 0px 7px 19px; font-weight:bold; background:url(/subway/img/cir.png) 7px 17px no-repeat;text-align: left;}
.window .popupContents .title + * { margin-bottom:20px; }

/* 인사말카드 swiper.js 인디케이터 숨기기 */
@media screen and (min-width: 780px) {
	/* .swiper-pagination.swiper-pagination-bullets { display:none; } */
}

</style>