/* ============ Notes Standard ===========

* z-index from min 1 to max 15
* Open San Weight 400,700

======================================== */
/* === Global Style === */
html { font-size: 62.5%; }

body { background: white; font-family: 'Open Sans', helvetica, arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 400; font-size: 16px; font-size: 1.6rem; line-height: 1; color: white; }

html, body { width: 100%; height: 100%; }

a, a:visited { color: white; text-decoration: none; }

a:hover { color: #202934; }

.page_wrap { position: relative; width: 100%; max-width: 1024px; margin: 0 auto; }

p { line-height: 1.6; margin: 0 0 16px 0; margin: 0 0 1.6rem 0; font-weight: 400; font-size: 18px; font-size: 1.8rem; }

h1 { font-size: 36px; font-size: 3.6rem; font-weight: 400; line-height: 1.2; }

h2 { font-size: 26px; font-size: 2.6rem; font-weight: 400; line-height: 1.2; }

h3 { font-size: 20px; font-size: 2rem; font-weight: 400; line-height: 1.2; }

h4 { font-size: 18px; font-size: 1.8rem; font-weight: 400; line-height: 1.2; }

h5 { font-size: 16px; font-size: 1.6rem; font-weight: 400; line-height: 1.2; }

h6 { font-size: 14px; font-size: 1.4rem; font-weight: 400; line-height: 1.2; }

input, select, textarea { -webkit-appearance: none; -moz-border-radius: none; -webkit-border-radius: none; border-radius: none; outline: none; }

.browsehappy { position: absolute; z-index: 15; top: 0; left: 0; width: 100%; background: #26a9e0; color: white; padding: 5px 25px; font-size: 14px; font-size: 1.4rem; }
.browsehappy a { font-weight: 700; }

#slides { position: relative; display: block; z-index: 1; }
#slides .slides-container { display: none; }
#slides .scrollable { *zoom: 1; position: relative; top: 0; left: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; height: 100%; }
#slides .scrollable:after { content: ""; display: table; clear: both; }

.slides-navigation { margin: 0 auto; position: absolute; z-index: 3; top: 46%; width: 100%; }
.slides-navigation a { position: absolute; display: block; }
.slides-navigation a.prev { left: 0; }
.slides-navigation a.next { right: 0; }

.slides-pagination { position: absolute; z-index: 3; bottom: 0; text-align: center; width: 100%; }
.slides-pagination a { border: 2px solid #222; border-radius: 15px; width: 10px; height: 10px; display: -moz-inline-stack; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR4nGP6zwAAAgcBApocMXEAAAAASUVORK5CYII="); margin: 2px; overflow: hidden; text-indent: -100%; }
.slides-pagination a.current { background: #222; }

.page_wrap { width: 100%; max-width: 1024px; margin: 0 auto; }

.content_right { float: right; margin: 5% 10% 50px 0; width: 330px; }
.content_right .small_center_link { text-align: center; font-size: 14px; font-size: 1.4rem; font-weight:600; color: white; }
.content_right .terms_privacy { text-align: center; font-size: 14px;}
.content_right .main_logo { text-align: center; padding: 15px 0; }
.content_right .block_content { margin-bottom: 55px; }
.content_right .block_content .img_wrap { margin-bottom: 10px; }
.content_right .block_content .img_wrap img { width: 70%; }
.content_right .block_content p { font-size: 15px; font-size: 1.5rem; }
.content_right .block_content .btn_wrap { text-align: center; margin-top: 25px; }
.content_right .block_content .btn_wrap a { padding: 8px 25px; font-size: 16px; font-size: 1.6rem; }
.content_right .block_content .btn_wrap a:hover { color: white; }

.content_right .form_done { display: none; padding-bottom:10px; }
.content_right .form_done ul { margin: 0; }
.content_right .form_done ul li { display: block; margin: 2px 0; }
.content_right .form_done ul li { font-size: 15px; font-size: 1.5rem; font-weight: 400; padding:10px 5px; background-image: url("../img/gl/bg_white_50.png"); background-repeat:repeat; background-color: rgba(255, 255, 255, 0.5); }
.content_right .form_done p { color: #323942; font-size: 16px; font-size: 1.6rem; font-weight: 400; }
.content_right .form_done a, .content_right .form_done a:visited { color: #323942; }
.content_right .form_done a:hover { color: #666666; text-decoration: underline; }

.content_right .form_empty { display: none; padding-bottom:10px; }
.content_right .form_error { display: none; background: #26a9e0; padding: 10px; line-height: 15px; line-height: 1.5rem; font-size: 13px; font-size: 1.3rem; }
.content_right .form_container { background-image: url("../img/gl/bg_white_50.png"); background-repeat:repeat; background-color: rgba(255, 255, 255, 0.5); padding: 20px 30px; }
.content_right .form_container .error_wrap { margin-bottom: 15px; clear: both; }
.content_right .form_container .status_wrap { padding-top: 5px; clear: both; }
.content_right .form_container .input_wrap { margin-bottom: 0; clear: both; }
.content_right .form_container .input_wrap input { border: none; margin: 0; padding: 10px 15px; width: 100%; color: #202934; }
.content_right .form_container .strength { margin: 5px 15px; color:#323942; line-height: 15px; line-height: 1.5rem; font-size: 12px; font-size: 1.2rem; }
.content_right .form_container .input_wrap .neturl_wrap input { padding: 5px 15px; }
.content_right .form_container .info { color: #323942; line-height: 19px; line-height: 1.9rem; }
.content_right .form_container button { width: 100%; padding: 10px 0; margin-bottom: 8px; font-size: 16px; font-size: 1.6rem; font-weight: 400; cursor: pointer; }
.content_right .footer_container { margin-top: 10px; margin-bottom: 20px; padding: 5px 30px; background: #26a9e0; }
.content_right .footer_container p { margin-bottom: 8px; }
.content_right .detail { margin-top: 20px; }
.content_right .detail hgroup { margin-bottom: 20px; }
.content_right .detail hgroup h1 { font-size: 40px; font-size: 4rem; font-weight: 700; }
.content_right .detail hgroup h2 { font-size: 24px; font-size: 2.4rem; }
.content_right .detail p { font-size: 15px; font-size: 1.5rem; }
.content_right .detail a, .content_right .detail a:visited { color: #26a9e0; }
.content_right .detail a:hover { text-decoration: underline; }

.info_msg  { color: #323942; padding: 3px 10px; line-height: 15px; line-height: 1.5rem; font-size: 12px; font-size: 1.2rem; }
.error_msg { display: none; background: #26a9e0; padding: 3px 10px; line-height: 15px; line-height: 1.5rem; font-size: 12px; font-size: 1.2rem; }
#strength_info { margin-top: 5px; margin-bottom:2px; }

.btn { background: #26a9e0; color: white; border: none; font-weight: 700; }
.btn:hover { background: #76b4e3; }

.btn_line { border: 2px solid white; text-align: center; margin-bottom: 5px; }
.btn_line a { display: block; color: white; padding: 10px; font-weight: 700; }
.btn_line:hover { background: #76b4e3; }

.content_center { margin: 10% auto 0 auto; max-width: 800px; padding: 0 30px; }
.content_center header { background: #323942; text-align: center; padding: 15px 0; }
.content_center article { background-image: url(../img/gl/bg_gray_50.png); background-repeat:repeat; background-color: rgba(50, 57, 66, 0.5); padding: 40px; }
.content_center article p { font-size: 14px; font-size: 1.4rem; line-height: 25px; line-height: 2.5rem; }
.content_center footer { margin-top: 3px; background-image: url(../img/gl/bg_blue_50.png); background-repeat:repeat; background-color: rgba(38, 169, 224, 0.5); padding: 20px 30px; }
.content_center footer .btn_center { float: left; width: -moz-calc(100%/3 - 20px); width: -webkit-calc(100%/3 - 20px); width: calc(100%/3 - 20px); margin: 0; }
.content_center footer .btn_center:nth-child(2) { margin: 0 30px; }

#cv_home, #cv_express, #cv_network { position: absolute; z-index: 3; top: 0; width: 100%; height: 100%; overflow: auto; }

#cv_express .form_container .small_center_link { font-size: 13px; font-size: 1.3rem; }
#cv_express .footer_container p { color: white; }

#cv_network .form_container .name_wrap_left, #cv_network .form_container .name_wrap_right { width: 125px; width: -moz-calc(100%/2 - 10px); width: -webkit-calc(100%/2 - 10px); width: calc(100%/2 - 10px); }
#cv_network .form_container .neturl_float { float: left; margin: 10px 0 0 0; padding: 0; color: #323942; font-size: 12px; font-size: 1.2rem; }
#cv_network .form_container .neturl_wrap { float: left; width: 140px; margin: 0 3px 0 4px; }
#cv_network .form_container .name_wrap_left { float: left; }
#cv_network .form_container .name_wrap_right { float: right; }
#cv_network .form_container .small_center_link a, #cv_network .form_container .small_center_link a:visited { color: #26a9e0; }
#cv_network .form_container .small_center_link a:hover { color: white; }
#cv_network .form_container .terms_privacy a, #cv_network .form_container .terms_privacy a:visited { color: white; text-decoration: underline;}
#cv_network .form_container .terms_privacy a:hover { color: #26a9e0; text-decoration: underline;}
#cv_network .form_container p { margin: 0; }

/* ============ Landscape  =============
======================================== */
@media screen and (min-width: 768px) and (max-width: 1024px), screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) { html { font-size: 55%; }
  .content_right .detail hgroup h1 { font-size: 47px; font-size: 4.7rem; }
  .content_right .detail hgroup h2 { font-size: 27px; font-size: 2.7rem; }
  #cv_network .form_container .neturl_float { font-size: 14px; font-size: 1.4rem; } }
/* ============ Portrait  ==============
======================================== */
@media screen and (min-width: 480px) and (max-width: 768px), screen and (min-device-width: 480px) and (max-width: 768px) and (orientation: portrait) { html { font-size: 55%; }
  .content_right .detail hgroup h1 { font-size: 47px; font-size: 4.7rem; }
  .content_right .detail hgroup h2 { font-size: 27px; font-size: 2.7rem; }
  #cv_network .form_container .neturl_float { font-size: 14px; font-size: 1.4rem; } }
/* ============= Mobile ================
****************************************
****************************************  
======================================== */
/* ======= Portrait & Landscape ========
======================================== */
@media screen and (max-width: 480px), screen and (max-device-width: 480px) { html { font-size: 50%; }
  .content_right .detail hgroup h1 { font-size: 51px; font-size: 5.1rem; }
  .content_right .detail hgroup h2 { font-size: 30px; font-size: 3rem; }
  #cv_network .form_container .neturl_float { font-size: 14px; font-size: 1.4rem; } }