.enable-js,.browsehappy{ background:#e3e3e3; color:#000; font-size: 0.88em; margin-bottom:.2em; padding: 0.5em; text-align:center; line-height:1.3; } .enable-js a,.browsehappy a{ font-weight:bold; } .site-head:after,.foot-nav:after,{ clear:both; content:""; display:table; } /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border: 0 none; list-style: none outside none; margin: 0; outline: 0 none; padding: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } html{ font-family:sans-serif; -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; } body{ margin:0; /*font-size: 14px;*/ /*font-size: 16.8px;*/ min-width: 320px; letter-spacing: -0.5px; font-family: 'Nanum Gothic', sans-serif; /*font-family: dotum, Helvetica,sans-serif;*/ } article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{ display:block; } [hidden],template{ display:none; } a{ color: inherit; /*color: #000000;*/ text-decoration: none; } a:active,a:hover{ outline:0; } b,strong{ font-weight:bold; } h1,h2,h3,h4,h5{ font-size:2em; margin:0.67em 0; } small{ font-size:80%; } sub,sup{ font-size:75%; line-height:0; position:relative; vertical-align:baseline; } sup{ top:-0.5em } sub{ bottom:-0.25em } svg:not(:root){ overflow:hidden; } figure{ margin:1em 40px } hr{ box-sizing:content-box; height:0 } button,input,optgroup,select,textarea{ color:inherit; font:inherit; margin:0; } button{ overflow:visible; background: none; } button,select{ text-transform:none; } button,html input[type="button"],input[type="reset"],input[type="submit"]{ -webkit-appearance:button; cursor:pointer; } button[disabled],html input[disabled]{ cursor:default; } button::-moz-focus-inner,input::-moz-focus-inner{ border:0; padding:0; } input{ line-height:normal; } input[type="checkbox"],input[type="radio"]{ box-sizing:border-box; padding:0; } input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{ height:auto; } input[type="search"]{ -webkit-appearance:textfield; box-sizing:content-box; } input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{ -webkit-appearance:none; } select, input[type="submit"] { -webkit-appearance: none; -moz-appearance: none; } legend{ border:0; padding:0; } textarea{ overflow:auto; } optgroup{ font-weight:bold; } table{ border-collapse:collapse; border-spacing:0; } td,th{ padding:0; } img{ max-width:100%; height:auto; border:0; display: inline-block; vertical-align: top; } img.full{ width:100%; display:block; } [class^="icon-"]::before,[class*=" icon-"]::before,[class^="icon-"]:before,[class*=" icon-"]:before{ display:none; } button:focus,input:focus,select:focus,textarea:focus{ outline:0; } label{ cursor:pointer; } figure,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,p{ margin:0; } dl,ul,ol{ padding:0; } ol,ul{ list-style:none; } li.current a{ color: #27c9ba; } .no-js .keyword button, .no-js .logoBox .arrow, .no-js .thumbBox-controls, .no-js .cmTv .titleBox .arrow { display: none; } .visually-hidden { position: absolute !important; white-space: nowrap !important; width: 1px !important; height: 1px !important; overflow: hidden; border: 0 !important; padding: 0 !important; clip: rect(0 0 0 0); -webkit-clip-path: inset(50%); clip-path: inset(50%); margin: -1px !important; } /**brand logo color: #26bcb7; brand-line: #27c9c3; gray-line:#d6d6d6; gray-border:#eaeaea; /*main page*/ .container:after{ clear:both; content:""; display:table; } .container{ padding-left:10px; padding-right:10px; max-width: 700px; margin:0 auto; } /**Style**/ .pb15{ padding-bottom: 15px; } .pb15:after { content: ''; display: table; clear: both; } .blue{ color:#26cac3; } .float_left{ float: left; } .float_right{ float: right; } /*header*/ .site-head{ overflow: hidden; border-bottom: 1px solid #d7d7d7; } .site-head .container{ position: relative; } .site-head .topHead{ /*border-bottom: 1px solid #ccc;*/ } .nav-toggle{ position: absolute; left:15px; top:25px; } .logo{ text-align: center; padding: 16px 0 12px 0; display: -webkit-flex; /* Safari */ -webkit-justify-content: center; /* Safari 6.1+ */ display: flex; justify-content: center; } .logo img{ height: 34px; } .site-head .mainNav{ overflow: hidden; width: 1000px; position: relative; height: 45px; } .mainNav nav{ position: absolute; top:0; left: 0; padding-top: 12px; font-weight: bold; } .mainNav nav ul li{ float: left; padding:0 15px; height: 33px; } .mainNav nav ul li a{ height: 33px; } .mainNav nav ul li.current{ border-bottom: 3px solid #26cac3; } .mainNav nav ul li.current a, .mainNav nav ul li a:hover{ color: #26cac3; } .search-toggle{ position: absolute; right: 15px; top: 25px; } .search { position: absolute; left: 0; width: 100%; color: #626262; background: #fff; top:9px; /* toggle search */ z-index: -2; opacity: 0; transition: opacity 0.25s; } /* toggle search */ .search.active { z-index: 0; opacity: 1; } .search .container { position: relative; } .search .btn-close{ position: absolute; right: 10px; bottom: 10px; } .search form{ border-bottom: 2px solid #000; width: 70%; margin: 0 auto; font-size: 1.3em; position: relative; } .search input{ padding: 10px; font-size: 0.8em; font-weight: bold; } .site-head-search button{ position: absolute; right:7px; bottom: 6px; } .nav-wrap{ position:fixed; top:0; left:-240px; width:240px; height:100%; overflow-x: hidden; overflow-y: auto; z-index:200; background-color:#f0f4f5; border-right: 1px solid #ccc; padding:24px; font-size: 1.2em; /* transform styles */ transition: left 0.25s; } /* transform styles */ .nav-wrap.active { left: 0; } .lt-ie9 .nav-wrap { display: none; } .lt-ie9 .nav-wrap.active { display: block; } .nav-wrap .btn-close{ float: right; font-size: 1.3em; } .site-nav li{ padding: 10px 0; font-weight: bold; font-size: 1em; } .site-nav li.login{ padding-top: 20px; } .site-nav li.login a{ background-color: #fff; border-radius: 13px; border:1px solid #717171; padding: 5px 20px; color: #717171; } .site-nav li a:hover{ color: #26bcb7; } /*Content*/ .main-container{ background-color: #f5f5f5; } .main-container .container{ padding-left: 0; padding-right: 0; } .main-container a:hover{ color:#26bcb7; } .mainSlide{ position: relative; } .dailyQT{ position: relative; font-weight: bold; padding: 10px 0; } .qttitle{ padding-bottom: 10px; float: left; } .dailyQT .photo{ background-size:cover; height: 300px; width: 100%; } .qttxt{ font-family: 'Nanum Myeongjo', serif; font-size: 1.6em; position: absolute; top: 160px; width: 100%; text-align: center; } .qttxt a{ color: #fff; text-shadow: 2px 2px 8px #000; padding: 0 10px; display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .control .arrowPrev, .control .arrowNext{ top:40%; } .mBanner{ background:#fff; padding: 10px 0; margin-bottom: 10px; text-align: center; } .mBanner img{ width: 100%; } .mainBox{ background: #fff; padding: 15px; margin-bottom: 10px; } .mainBox .thumbBox, .cmTv .thumbBox { overflow: hidden; clear: none; } .mainBox .thumbBox ul, .cmTv .thumbBox ul { margin-right: -14px; font-size: 0; } .mainBox .thumbBox li, .cmTv .thumbBox li{ width: 50%; display: inline-block; vertical-align: top; padding-right: 14px; font-size: 16px; font-size: 1rem; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mainBox li img{ width: 100; max-height: 171px; } .des{ padding: 6px 0 15px 0; font-size: 0.98em; } .titleBox .view{ padding-right: 10px; } .titleBox{ overflow: hidden; padding:5px 0 15px 0; } .titleBox li{ float: left; } .titleBox li a{ font-weight: bold; color: #26bcb7; } .arrow{ float: right; color: #979797; } .arrow img{ float: right; margin-left: 5px; margin-top: 2px; } .no-js .tab { display: none; } .tab { overflow: hidden; } .tab > div{ float: left; text-align: center; width: 33%; padding: 5px 0; font-weight: bold; background: #fff; cursor: pointer; } .tab .tns-nav-active { background: #27c9c3; color: #fff; } .thumbBox{ overflow: hidden; clear: both; } .thumbBox img{ width: 100%; } .thumbBox ul li p{ overflow: hidden; height: 38px; line-height: 1.3em; } .thumbBox .des p{ font-size: 1em; font-weight: bold; line-height: 1.3em; } .cmTv{ position: relative; } .cmTv .thumbBox ul li{ float: left; width: 50%; } .cmTv .thumbBox ul li>a{ position: relative; display: block; } .cmTv .titleBox ul{ color: #333; } .cmTv .titleBox li{ padding:0 8px 0px 8px; } .cmTv .titleBox h2 { float: left; font-size: inherit; padding-right: 5px; } .cmTv .titleBox li a{ color: #000; } .cmTv .titleBox li a:hover, .cmTv .titleBox li.current a{ color: #268abc; } .cmTv .titleBox h2 span{ background: #268abc; color: #fff; padding: 2px 5px; border-radius: 3px; } .cmTv-nav .tns-nav-active { color:#268abc; } .thumbList ul li{ border-bottom: 1px solid #eaeaea; overflow: hidden; padding: 12px 0; } .thumbList ul li:last-child{ border-bottom:none; padding-bottom: 0; } .thumbList ul li img{ float: right; max-width: 25%; display: inline-block; } .thumbList ul li .des{ float: left; width: 65%; padding: 6px 0 0 0; } .thumbList ul li .des p{ padding:5px 0 0 5px; font-weight: bold; line-height: 1.5; } .thumbList ul li .des div{ color: #666; font-size: 0.8em; padding:6px 0 0 5px; } .prayerBox{ height: 325px; position: relative; } .prayerBox ul{ position: absolute; width:1710px; } .prayerBox li{ width: 284px; float: left; padding-right: 15px; } .prayerBox .des{ padding:10px 0; } .prayerBox .des p{ height: 42px; line-height: 1.3; overflow: hidden; } .prayerBox .des .author{ color: #666; padding: 8px 0 12px 0; font-size: 0.95em; } .prayerBox .des .date{ color: #26bcb7; position: relative; padding-bottom: 25px; } .prayerBox .des .date span{ position: absolute; right: 0; } .prayerBox ul li a.button{ display: block; text-align: center; padding: 5px 0; background: #f1f1f1; color: #666; font-weight: bold; } .prayerBox ul li a.button:hover{ background: #26bcb7; color: #fff; } .newsList ul li p{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .opinion ul li img{ width: 69px; } .resourceBox{ height: 252px; } .resourceBoxTag{ width: 1710px; overflow: hidden; } .resourceBoxTag ul li{ float: left; border-radius: 20px; background: #e6e6e6; color: #26bcb7; margin-right: 10px; margin-bottom: 15px; padding: 8px 20px; font-weight: bold; cursor: pointer; } .resourceBoxTag ul li.all{ background: #26bcb7; color: #fff; } .mainBox2{ border:1px solid #d8dcdd; } .prayerRQ, .logoBox, .titleBox, .logoList, .rightBox,.dailyQT,.mainBox,.mainBox2,.featuredBox{ clear: both; overflow: hidden; } .newsBox{ padding:15px; } .newsBox .list li{ padding: 5px 0; font-weight: bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .arrowPrev, .arrowNext{ position: absolute; width:34px; text-align: center; padding: 15px 0; font-size: 1.6em; color: #fff; top:20%; background: #000; opacity: 0.5; filter: alpha(opacity=50); /* For IE8 and earlier */ cursor: pointer; } .arrowPrev{ left:0; } .arrowNext{ right: 0; } .footer{ clear: both; overflow: hidden; padding:20px; text-align: center; background: #fff; } .footer ul{ clear: both; overflow: hidden; width: 320px; margin:0 auto; font-size: 0.9em; } .footer ul li{ float: left; border-right:1px solid #ccc; padding:0 8px 0 8px; } .footer ul li:first-child{ padding-left:0; } .footer ul li:last-child{ padding-right:0; border-right: 0; } .footer ul li a{ color: #717171; } .footer ul.social{ padding: 10px 0 0 79px; } .footer .ftLogo img{ height: 22px; margin-bottom: 15px; } .footer ul li i, .footer ul li a:hover{ color: #27c9ba; } .footer ul li i{ padding-right: 8px; } .footer .copy{ clear: both; color: #999; font-size: 0.9em; padding-top: 20px; letter-spacing: 0; } .address{ color: #717171; text-align: center; padding: 20px 0; font-size: 0.9em; line-height: 1.3; }