.homepage .top-wrap { background:url(../img/homepage-top-bg.jpg) center center no-repeat; background-size: cover;} #top { padding-top: 80px; padding-bottom: 110px; text-align: center;} #tops { padding-top: 80px; padding-bottom: 110px; text-align: center;} #top h1 { font-size: 48px; font-family: "Roboto", sans-serif; font-weight: bold; margin-bottom: 40px; margin-top: 0px; text-shadow: 12px 1px 20px #ffffff, 13px -1px 20px #ffffff, 2px 8px 20px #ffffff, -9px 15px 20px #ffffff, 10px 18px 20px white, -20px -2px 20px white, 17px -8px 20px white; } #top h2 { font-size: 30px; font-weight: 600; margin-top: 0px; margin-bottom: 80px;text-shadow: 12px 1px 20px #ffffff, 13px -1px 20px #ffffff, 2px 8px 20px #ffffff, -9px 15px 20px #ffffff, 10px 18px 20px white, -20px -2px 20px white, 17px -8px 20px white;} #top a { font-size: 24px; font-weight: 600; margin-top: 0px; margin-bottom: 80px;} #top h2 span { font-size: 30px; font-weight: 600; border-bottom: 4px solid #2055a3; line-height: 30px; display: inline-block;text-shadow: 12px 1px 20px #ffffff, 13px -1px 20px #ffffff, 2px 8px 20px #ffffff, -9px 15px 20px #ffffff, 10px 18px 20px white, -20px -2px 20px white, 17px -8px 20px white;} /*#top .button { background-color: #fff; color: #2055a3; text-decoration: none; padding: 16px 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; font-size: 18px; text-transform: uppercase; font-weight: 600; } #top .button:hover { background: #2055a3; color: #fff;}*/ #top-new h1 { font-size: 48px; font-family: "Roboto", sans-serif; font-weight: bold; margin-bottom: 40px; margin-top: 0px;} #top-new h2 { font-size: 30px; font-weight: 600; margin-top: 0px; margin-bottom: 80px;} #top-new a { font-size: 24px; font-weight: 600; margin-top: 0px; margin-bottom: 80px;} #top-new h2 span { font-size: 30px; font-weight: 600; border-bottom: 4px solid #2055a3; line-height: 30px; display: inline-block;} #top-new h1.fz36 {font-size: 36px} header { z-index: 3; background: #fff; position: relative; } #header { z-index: 3; position: relative;} h2.header:before {-webkit-box-shadow: 4px 4px 13px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 4px 4px 13px 0px rgba(0, 0, 0, 0.2); box-shadow: 4px 4px 13px 0px rgba(0, 0, 0, 0.2);} .welcome-wrap {} #welcome { padding-top: 100px;} #welcome h2.header:before { background: #2055a3 url(../img/h2-icon-01.png) center center no-repeat;} #welcome .photo { text-align: center; max-width: 500px; margin: 0 auto; padding-bottom: 40px;} #welcome .photo img { max-width: 100%;} #welcome h3 { font-size: 16px; font-weight: bold; background-color: #2055a3; padding-top: 12px; padding-bottom: 12px; text-align: center; color: #fff;} #welcome .desc { padding-right: 30px;} #helps { padding-top: 30px;} #helps h2.header { padding-top: 0px; line-height: 38px; margin-bottom: 110px;} #helps h2.header:before { background: #2055a3 url(../img/h2-icon-02.png) center center no-repeat;} #helps .item { margin-bottom: 70px; position: relative;} #helps .item:before { font-size: 120px; font-family: "Roboto", sans-serif; font-weight: bold; color: rgba(10,10,10,0.1); position: absolute; display: block; left: 10px; top: -30px; line-height: 120px;} #helps .item-01:before { content: "1";} #helps .item-02:before { content: "2";} #helps .item-03:before { content: "3";} #helps .item-04:before { content: "4";} #helps .item-05:before { content: "5";} #helps .item-06:before { content: "6";} #helps .item-07:before { content: "7";} #helps .item-08:before { content: "8";} #helps .text-center { padding-top: 35px;} #helps .text-center img { width: 90%; margin: 0 auto; max-width: 403px; height: auto;} #business {} #business h2.header { padding-top: 0px; margin-bottom: 100px;} #business h2.header:before { background: #2055a3 url(../img/h2-icon-03.png) center center no-repeat; top: 5px;/*top: 25px;*/} #business .item { max-width: 264px; margin: 0 auto; margin-bottom: 90px; min-height: 380px; -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); } #business .item img { width: 100%; max-width: 264px;} #business .item-name { font-size: 18px; font-weight: 600; padding-top: 10px; padding-bottom: 10px;} #business .item-desc { padding-left: 25px; padding-right: 20px;padding-bottom: 10px;} #business .row > div { text-align: center;} #important-header { padding-top: 60px; padding-bottom: 100px;} #important-header h2.header { padding-top: 0px;} #important-header h2.header:before { background: #2055a3 url(../img/h2-icon-04.png) center center no-repeat; top: 5px;/*top: 25px;*/} .important-p1-wrap { background:url(../img/important-bg.jpg) center top no-repeat; background-size: cover;} #important-p1 { padding-top: 80px; padding-bottom: 80px;} #important-p1 h3 { margin-top: 0px; margin-bottom: 30px; font-weight: 600; font-size: 30px;} #important-p1 p { max-width: 920px; font-size: 24px;} #important-p2 { padding-top: 90px;} #important-p2 h3 { margin-top: 0px; margin-bottom: 30px; font-weight: 600; font-size: 30px;} #important-p2 .row { text-align: center;} #important-p2 .item { max-width: 360px; margin: 0 auto; padding: 25px 45px; min-height: 484px; -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.1); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.1); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.1); background-color: #2055a3; margin-bottom: 130px; } #important-p2 .item * { color: #fff;} #important-p2 .item.odd { background-color: #fff;} #important-p2 .item.odd * { color: #0a0a0a;} .button { background-color: #fff; color: #2055a3; text-decoration: none; padding: 16px 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; font-size: 18px; text-transform: uppercase; font-weight: 600; display: inline-block; } .button:hover { background: #2055a3; color: #fff;} .button-inverted, .button-inverted:focus { background: #2055a3; color: #fff; border: 1px solid #2055a3; text-decoration: none;} .button-inverted:hover { background: #fff; color: #2055a3; text-decoration: none;} .button-white { background: #fff; color: #2055a3; border: 1px solid #fff;} .button-white:hover { background: #2055a3; color: #fff; border: 1px solid #2055a3; text-decoration: none;} .button-site {position: relative;} .button-site:after {background: url("/templates/navigator4life/main/img/arrow-button.svg") center center no-repeat; content: ""; right: 20px; top: 10px; position: absolute; height: 35px; width: 40px;} .button-site:hover:after {background: url("/templates/navigator4life/main/img/arrow-button-blue.svg") center center no-repeat; content: ""; right: 20px; top: 10px; position: absolute; height: 35px; width: 40px;} .button-reward {position: relative; font-weight: bold; color: #fff !important; padding: 15px 15px 15px 60px} .button-reward:hover {color: #fff} .button-reward:after {background: url("/templates/navigator4life/main/img/arrow-botton-reward.svg") center center no-repeat; content: ""; left: 10px; top: 10px; position: absolute; height: 35px; width: 35px; background-size: contain;} .button-reward:hover:after {background: url("/templates/navigator4life/main/img/arrow-botton-reward.svg") center center no-repeat; content: ""; left: 10px; top: 10px; position: absolute; height: 35px; width: 35px; background-size: contain;} #important-p2 .button { background: #fff; color: #2055a3 !important; border: 1px solid #fff; font-size: 18px} #important-p2 .button:hover { background: #2055a3; color: #fff !important; text-decoration: none;} #important-p2 .item-name { font-size: 18px; font-weight: 600;} #important-p2 .item-desc { font-size: 18px;} #important-p2 .item-check { padding-top: 25px; padding-bottom: 25px;} #important-p2 .item-button { padding-top: 40px;} #important-p2 .item-desc ul { padding-left: 0px;} #important-p2 .item-desc li { text-align: left; font-size: 18px; list-style-type: none; padding-left: 35px; background:url(../img/x-mark-icon.png) left 4px no-repeat;} #important-p2 .item-desc li+li { margin-top: 17px;} .important-p3-wrap { background:url(../img/important-p3-bg.jpg) center top no-repeat;} #important-p3 { min-height: 770px; padding-top: 40px;} #important-p3 p { font-size: 24px;} #important-p3 h3 { margin-top: 0px; margin-bottom: 30px; font-weight: 600; font-size: 30px;} #i-want { padding-bottom: 130px; padding-top: 120px;} #i-want h2.header { padding-top: 0px; margin-bottom: 84px;} #i-want h2.header:before { background: #2055a3 url(../img/h2-icon-06.png) center center no-repeat; top: 5px;/*top: 25px;*/} #wanna-try { padding-top: 150px;} #wanna-try h2.header { padding-top: 0px; margin-bottom: 84px;} #wanna-try h2.header a{ font-size: 36px; font-family: "Roboto", sans-serif;} #wanna-try h2.header:before { background: #2055a3 url(../img/h2-icon-05.png) center center no-repeat; top: 5px;/*top: 25px;*/} #wanna-try .row { margin-bottom: 80px; -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); } #wanna-try .item-desc { padding-top: 25px; padding-bottom: 25px;} #wanna-try .item-01 .item-img {position: relative;} #wanna-try .item-01 .item-img p {color: #fff; padding: 20px; position: absolute; bottom: 0px; left: 0px;} #wanna-try .item-01 .item-img { background:url(../img/wanna-try-img-01.jpg) center center no-repeat; background-size: cover;} #wanna-try .item-02 .item-img { background:url(../img/wanna-try-img-02.jpg) center center no-repeat; background-size: cover;} #wanna-try .item-03 .item-img { background:url(../img/wanna-try-img-03.jpg) center center no-repeat; background-size: cover;} #wanna-try .item-04 .item-img { background:url(../img/wanna-try-img-04.jpg) center center no-repeat; background-size: cover;} #wanna-try ul { padding-left: 0px;} #wanna-try p, #wanna-try b { font-size: 18px;} #wanna-try b { font-weight: 700;} #wanna-try h3 { font-size: 18px; font-weight: bold;} #wanna-try .item-desc { padding-left: 50px; padding-right: 50px;} #wanna-try li { font-size: 18px; list-style-type: none; position: relative; padding-left: 30px;} #wanna-try li:before { position: absolute; display: block; content: ""; width: 15px; height: 15px; left: 0px; top: 6px; background-color: #2055a3; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; } #wanna-try li+li { margin-top: 15px;} #wanna-try .button { padding-left: 20px; padding-right: 20px;} ul.no-lebel li {list-style-type: none; word-break: break-word} #users-id img {width: auto; max-width: 100%} /*#users-id li { font-size: 18px; list-style-type: none; position: relative; padding-left: 30px;} #users-id li:before { position: absolute; display: block; content: ""; width: 15px; height: 15px; left: 0px; top: 6px; background-color: #2055a3; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; }*/ @media (max-width: 992px){ #important-p2 .item { padding: 20px 15px;} #wanna-try .item-desc { padding-left: 10px; padding-right: 10px;} #wanna-try .item-desc p, #wanna-try .item-desc li { font-size: 16px;} } @media (max-width: 1366px) { #top { padding-top: 80px; padding-bottom: 50px; } } @media (max-width: 768px){ #helps .text-center img { display: none;} #business .item { min-height: 0px; padding-bottom: 10px; margin-bottom: 40px;} #important-p2 .item { margin-bottom: 30px;} .important-p3-wrap { background: none;} #important-p3 { min-height: 0px; padding-bottom: 40px;} #wanna-try .row { margin-bottom: 50px;} #wanna-try .item-img { height: 200px;} #top h1 { font-size: 36px;} #top h2, #top a { font-size: 24px;} #top-new h1 { font-size: 36px;} #top-new h2, #top a { font-size: 24px;} #important-p3 p { font-size: 18px;} #wanna-try { padding-top: 60px;} } @media (max-width: 576px){ #top h1 { font-size: 24px;} #top h2, #top a { font-size: 18px;} #top-new h1 { font-size: 24px;} #top-new h2, #top a { font-size: 18px;} } /* tools page */ #modules { padding-top: 100px;} #modules h2.header { padding-top: 0px; margin-bottom: 84px;} #modules h2.header a{ font-size: 36px; font-family: "Roboto", sans-serif;} #modules h2.header:before { background: #2055a3 url(../img/h2-icon-12.png) center center no-repeat; top: 5px;/*top: 25px;*/} #modules .row { margin-bottom: 80px; -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); } #modules .item-desc { padding-top: 25px; padding-bottom: 25px;} #modules .item-img {min-height: 510px;} #modules .item-01 .item-img { background:url(../img/modules-img-01.jpg) center center no-repeat; background-size: cover;} #modules .item-02 .item-img { background:url(../img/modules-img-02.jpg) center center no-repeat; background-size: cover;} #modules .item-03 .item-img { background:url(../img/modules-img-03.jpg) center center no-repeat; background-size: cover;} #modules .item-04 .item-img { background:url(../img/modules-img-04.jpg) center center no-repeat; background-size: cover;} #modules .item-05 .item-img { background:url(../img/modules-img-05.jpg) center center no-repeat; background-size: cover;} #modules .item-06 .item-img { background:url(../img/modules-img-06.jpg) center center no-repeat; background-size: cover;} #modules .item-07 .item-img { background:url(../img/modules-img-07.jpg) center center no-repeat; background-size: cover;} #modules .item-08 .item-img { background:url(../img/modules-img-08.jpg) center center no-repeat; background-size: cover;} #modules .item-09 .item-img { background:url(../img/modules-img-09.jpg) center center no-repeat; background-size: cover;} #modules .item-10 .item-img { background:url(../img/modules-img-10.jpg) center center no-repeat; background-size: cover;} #modules .item-11 .item-img { background:url(../img/modules-img-11.jpg) center center no-repeat; background-size: cover;} #modules .item-12 .item-img { background:url(../img/modules-img-12.jpg) center center no-repeat; background-size: cover;} #modules .item-13 .item-img { background:url(../img/modules-img-13.jpg) center center no-repeat; background-size: cover;} #modules .item-14 .item-img { background:url(../img/modules-img-14.jpg) center center no-repeat; background-size: cover;} #modules .item-15 .item-img { background:url(../img/modules-img-15.jpg) center center no-repeat; background-size: cover;} #modules ul { padding-left: 0px;} #modules p, #wanna-try b { font-size: 18px;} #modules b { font-weight: 600;} #modules h3 { font-size: 18px; font-weight: bold;} #modules .item-desc { padding-left: 50px; padding-right: 50px;} #modules li { font-size: 18px; list-style-type: none; position: relative; padding-left: 30px;} #modules li:before { position: absolute; display: block; content: ""; width: 15px; height: 15px; left: 0px; top: 6px; background-color: #2055a3; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; } #modules li+li { margin-top: 15px;} /*#modules .button { padding-left: 60px; padding-right: 60px;}*/ #modules .separator { padding-bottom: 80px;} @media (max-width: 992px){ #modules .item-desc { padding-left: 10px; padding-right: 10px;} #modules .item-desc p, #wanna-try .item-desc li { font-size: 16px;} } @media (max-width: 768px){ #modules .row { margin-bottom: 50px;} #modules .item-img { height: 240px; min-height: 0px;} #modules { padding-top: 60px;} } @media (max-width: 576px){ } /* tools page */ /*about page*/ .top-quote { text-align: right; font-style: italic; margin-top:0px; margin-bottom:0px;padding-top: 80px;} .top-quote{ font-family: "Roboto", sans-serif; text-shadow: 12px 1px 20px #ffffff, 13px -1px 20px #ffffff, 2px 8px 20px #ffffff, -9px 15px 20px #ffffff, 10px 18px 20px white, -20px -2px 20px white, 17px -8px 20px white;/* font-weight: bold;*/} .tq p {font-size: 24px; padding-top: 50px; line-height: 1.4em;} #about-p1 { padding-top: 50px;} #about-p1 h2.header { padding-top: 0px; margin-bottom: 84px;} #about-p1 h2.header a { font-size: 36px; font-family: "Roboto", sans-serif;} #about-p1 h2.header:before { background: #2055a3 url(../img/h2-icon-03.png) center center no-repeat; top: 5px;/*top: 25px;*/} #about-p1 .item-desc { padding-top: 25px; padding-bottom: 25px;padding-left: 50px; padding-right: 50px;} #about-p1 .item-01 .item-img { background:url(../img/about-p1-img.jpg) center center no-repeat; background-size: cover;} #about-p1 .row { margin-bottom: 80px; -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); } #about-p2 {} #about-p2 h2.header { padding-top: 0px; margin-bottom: 84px;} #about-p2 h2.header:before { background: #2055a3 url(../img/h2-icon-06.png) center center no-repeat; top: 5px;/*top: 25px;*/} #about-p2 .item { text-align: center; -webkit-box-shadow: 0px 3px 20px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 20px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 20px 0px rgba(35, 0, 70, 0.2); max-width: 330px; margin: 0 auto; margin-bottom: 40px; } #about-p2 .item-name { padding-top: 30px; padding-bottom: 20px; font-weight: 600;} #about-p2 .item-desc { padding-left: 10%; padding-right: 10%; padding-bottom: 20px;} #about-p2 p.text-center { margin-top: 30px; margin-bottom: 30px;} #about-p3 h2.header { padding-top: 0px; margin-bottom: 84px;} #about-p3 h2.header:before { background: #2055a3 url(../img/h2-icon-07.png) center center no-repeat; top: 5px;/*top: 25px;*/} #about-p3 .item-desc { padding-top: 55px; padding-bottom: 55px;padding-left: 50px; padding-right: 50px;} #about-p3 .item-01 .item-img { background:url(../img/about-p3-img.jpg) center center no-repeat; background-size: cover;} #about-p3 .row { margin-bottom: 80px; -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); } #about-p3 .text-center { font-size: 24px; margin-top: 40px; margin-bottom: 40px;} #about-p4 { padding-top: 30px; padding-bottom: 60px;} #about-p4 h2.header { padding-top: 0px; margin-bottom: 84px;} #about-p4 h2.header:before { background: #2055a3 url(../img/h2-icon-08.png) center center no-repeat; top: 5px;} #about-p4 .item-desc { padding-top: 25px; padding-bottom: 30px;padding-left: 50px; padding-right: 50px;} #about-p4 .item-01 .item-img { background:url(../img/about-p4-img.jpg) center center no-repeat; background-size: cover;} #about-p4 .row { margin-bottom: 80px; -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); } #about-p4 h2.text-center { font-weight: bold; margin-bottom: 40px;} .about-p5-wrap { background:url(../img/about-p5-bg.jpg) center center no-repeat; background-size: cover;} #about-p5 { text-align: center; padding-top: 50px; padding-bottom: 50px;} #about-p6 h2.header { padding-top: 0px; margin-bottom: 84px;} #about-p6 h2.header:before { background: #2055a3 url(../img/h2-icon-13.png) center center no-repeat; top: 5px;} #about-p6 { padding-bottom: 80px;} #about-p6 > p.text-center { padding-top: 40px; padding-bottom: 60px; font-size: 24px; font-weight: 600;} #about-p6 > div.text-center { padding-top: 60px;} #about-p6 h3 { text-align: center; font-size: 24px; margin-top: 50px; margin-bottom: 40px; } #about-p6 .item { padding: 20px 50px;} #about-p6 .item h4 { font-size: 18px; font-weight: bold;} #about-p6 .item.blue { background: #bfd9f0;} #about-p6 .row { -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); } #about-p8 h2.header { padding-top: 0px; margin-bottom: 84px;} #about-p8 h2.header:before { background: #2055a3 url(../img/h2-icon-05.png) center center no-repeat; top: 5px;} #about-p8 .row-01 { background:url(../img/about-p8-img-01.jpg) left center no-repeat;} #about-p8 .row-02 { background:url(../img/about-p8-img-02.jpg) right top no-repeat; padding-top: 20px;} #about-p8 .row-03 { background:url(../img/about-p8-img-03.jpg) left center no-repeat;} #about-p8 .item { padding-bottom: 45px; position: relative; padding-left: 60px;} #about-p8 .item p, #about-p8 .item p a { font-size: 24px; line-height: 1.2em;} #about-p8 .item:before { display: block; position: absolute; font-family: "Roboto", sans-serif; font-weight: bold; font-size: 60px; color: #0067c3; left: 0px; line-height: 60px;} #about-p8 .item-01:before { content: "1.";} #about-p8 .item-02:before { content: "2.";} #about-p8 .item-03:before { content: "3.";} #about-p8 .item-04:before { content: "4.";} #about-p8 .item-05:before { content: "5.";} #about-p8 .item-06:before { content: "6.";} #about-p8 .item-07:before { content: "7.";} #about-p8 .item-08:before { content: "8.";} #about-p9 { padding-bottom: 100px;} #about-p9 h2.header { padding-top: 0px; margin-bottom: 84px;} #about-p9 h2.header:before { background: #2055a3 url(../img/h2-icon-09.png) center center no-repeat; top: 5px;} #about-p9 p.text-center { font-size: 24px; padding-top: 70px; padding-bottom: 70px;} #about-p9 .item { position: relative; padding-left: 130px; min-height: 64px; padding-top: 20px; padding-bottom: 20px;} #about-p9 .item+.item { margin-top: 30px;} #about-p9 .item:before { display: block; width: 65px; height: 65px; position: absolute; content: ""; left: 0px; top: 50%; margin-top: -32px;} #about-p9 .item-01:before { background:url(../img/about-p9-img-01.png) center center no-repeat;} #about-p9 .item-02:before { background:url(../img/about-p9-img-02.png) center center no-repeat;} #about-p9 .item-03:before { background:url(../img/about-p9-img-03.png) center center no-repeat;} #about-p9 .item-04:before { background:url(../img/about-p9-img-04.png) center center no-repeat;} #about-p9 .item-05:before { background:url(../img/about-p9-img-05.png) center center no-repeat;} #about-p9 .item-06:before { background:url(../img/about-p9-img-06.png) center center no-repeat;} #about-p9 .item-07:before { background:url(../img/about-p9-img-07.png) center center no-repeat;} @media (max-width: 768px){ #about-p8 .row-01, #about-p8 .row-02, #about-p8 .row-03 { background: none;} #about-p1 .item-img, #about-p1 .item-img, #about-p1 .item-img, #about-p1 .item-img #about-p1 .item-img, #about-p3 .item-img, #about-p4 .item-img { height: 200px;} } /*about page*/ /*study page*/ #study-p1 { padding-top: 110px; padding-bottom:80px;} #study-p1 .item-desc { padding-top: 55px; padding-bottom: 55px;padding-left: 50px; padding-right: 50px;} #study-p1 .item-img { background:url(../img/study-p1-img.jpg) center center no-repeat; background-size: cover;} #study-p1 .row { margin-bottom: 80px;} #study-p1 .text-center { font-size: 24px;} #study-p2 { padding-top: 0px;} #study-p2 h2.header { padding-top: 0px; line-height: 38px; margin-bottom: 110px;} #study-p2 h2.header:before { background: #2055a3 url(../img/h2-icon-02.png) center center no-repeat;} #study-p2 .item { margin-bottom: 70px; position: relative; min-height: 120px;} #study-p2 .item:before { font-size: 120px; font-family: "Roboto", sans-serif; font-weight: bold; color: rgba(10,10,10,0.1); position: absolute; display: block; left: 10px; top: -30px; line-height: 120px;} #study-p2 .item-01:before { content: "1";} #study-p2 .item-02:before { content: "2";} #study-p2 .item-03:before { content: "3";} #study-p2 .item-04:before { content: "4";} #study-p2 .item-05:before { content: "5";} #study-p2 .item-06:before { content: "6";} #study-p2 .item-07:before { content: "7";} #study-p2 .item-08:before { content: "8";} #study-p2 .text-center { padding-top: 35px;} #study-p2 .text-center img { width: 90%; margin: 0 auto; max-width: 403px; height: auto;} #study-p2 .col-left .item { padding-left: 80px;} #study-p2 .col-right .item { padding-right: 80px;} #study-p2 .col-right .item:before { font-size: 120px; font-family: "Roboto", sans-serif; font-weight: bold; color: rgba(10,10,10,0.1); position: absolute; display: block; left: auto; right: 10px; top: -30px; line-height: 120px;} #study-p3 .text-center { font-size: 24px; margin-bottom: 50px;} /*#study-p3 { padding-bottom: 100px;}*/ #study-p3 .item { padding: 5px;} #study-p3 .item .inner{ -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); height: 100%; text-align: center; padding: 10px; } #study-p3 .item p { font-size: 18px; line-height: 24px; } #study-p3 .item.blue .inner { background-color: #0067c3;} #study-p3 .item.blue p { color: #fff;} #study-p3 h2.header { padding-top: 0px; line-height: 38px; margin-bottom: 50px; margin-top: 120px;} #study-p3 h2.header:before { background: #2055a3 url(../img/h2-icon-10.png) center center no-repeat;} #study-p8 { padding-top: 60px; padding-bottom: 120px;} #study-p8 h2.header { padding-top: 0px; line-height: 38px; margin-bottom: 50px;} #study-p8 h2.header:before { background: #2055a3 url(../img/h2-icon-10.png) center center no-repeat;} #study-p8 .text-center p { font-size: 24px; margin-bottom: 50px;} #study-p4 .item, #study-p5 .item, #study-p6 .item, #study-p7 .item { padding: 15px 15px 15px 100px; position: relative; margin-bottom: 40px; background: rgba(255,255,255,0.75); min-height: 80px; -webkit-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); -moz-box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); box-shadow: 0px 3px 25px 0px rgba(35, 0, 70, 0.2); } #study-p4 .item:before, #study-p5 .item:before, #study-p6 .item:before, #study-p7 .item:before {font-size: 60px; font-family: "Roboto", sans-serif; font-weight: bold; color: #0067c3; position: absolute; display: block; left: 20px; top: 10px; line-height: 60px;} #study-p4 h3, #study-p6 h3 { color: #fff; margin-bottom: 40px; margin-top: 0px;font-family: "Roboto", sans-serif; font-size: 36px; font-weight: 600;} #study-p4, #study-p5, #study-p6, #study-p7 { padding-top: 60px; padding-bottom: 20px;} .study-p4-wrap { background:url(../img/study-p4-bg.jpg) center top no-repeat; background-size: cover;} .study-p6-wrap { background:url(../img/study-p6-bg.jpg) center top no-repeat; background-size: cover;} #study-p4 .item-01:before { content: "1.";} #study-p4 .item-02:before { content: "2.";} #study-p4 .item-03:before { content: "3.";} #study-p4 .item-04:before { content: "4.";} #study-p5 .item-05:before { content: "5.";} #study-p5 .item-06:before { content: "6.";} #study-p5 .item-07:before { content: "7.";} #study-p5 .item-08:before { content: "8.";} #study-p5 .item-09:before { content: "9.";} #study-p6 .item-01:before { content: "1.";} #study-p6 .item-02:before { content: "2.";} #study-p6 .item-03:before { content: "3.";} #study-p6 .item-04:before { content: "4.";} #study-p7 .item-05:before { content: "5.";} #study-p7 .item-06:before { content: "6.";} #study-p7 .item-07:before { content: "7.";} #study-p7 .item-08:before { content: "8.";} #study-p7 .item-09:before { content: "9.";} @media (max-width: 768px){ #study-p2 .text-center { display: none;} #study-p2 .item { padding-right: 0px; padding-left: 80px; min-height: 80px;} #study-p2 .col-right .item:before { left: 10px; right: auto;} } /*study page*/