@charset "utf-8";

/* ----------------------------------

Name:style.css
Version:1.0.0

----------------------------------

Table of contents
        
    01.  Google font
    02.  Reset
    03.  Typography
    04.  Icon
    05.  Background color
    06.  Custom
    07.  Border
    08.  Scroll to top
    09.  Slider background and overlay
    10.  Navigation
    11.  Page titles
    12.  Section
    13.  Footer
    14.  Owl carousel
    15.  Slider and parallax typography
    16.  Parallax
    17.  One page
    18.  Bootstrap slider
    19.  Portfolio - ajax
    20.  Portfolio - multi pages
    21.  Masonry portfolio - home
    22.  Full screen video
    23.  Half screen video
    24.  Coming soon
    25.  Full width image
    26.  Blog
    27.  Intro
    28.  Portfolio
    29.  Elements
    30.  Pages
    31.  Shop
    32.  Onepage demo
    33.  Multipage demo

*/

/* ===================================
    Google font
====================================== */
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700);
@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300italic,700);

/* ===================================
    Reset
====================================== */

body{ font-family: 'Open Sans', sans-serif; -webkit-font-smoothing: antialiased; font-size:13px; color:#626262; line-height:23px; letter-spacing: 0.02em }
a{ color: #000; }
a:hover{ color: #575757; }
img { -webkit-backface-visibility: hidden; max-width:100%; height:auto; }
video { background-size: cover; display: table-cell; vertical-align: middle; width: 100%; }
ul{ margin: 0px; padding:0px; }
input, textarea, select{ border: 1px solid #dfdfdf; letter-spacing: 1px; font-size: 11px;  padding: 8px 15px; width: 100%; margin: 0 0 20px 0; text-transform: uppercase; max-width: 100%; resize: none;}
input[type="submit"] { width: auto}
input[type="button"], input[type="text"], input[type="email"], input[type="search"], input[type="password"], textarea, input[type="submit"] { -webkit-appearance: none;  border-radius: 0; }
input:focus, textarea:focus{ border: 1px solid #989898; }
input[type="submit"]:focus { border:none !important}
select::-ms-expand{ display:none; }
iframe { border: 0;}
.sound iframe {width:100%}
ul { list-style: none outside none; }
ul, ol, dl {list-style-position: outside;}
* { transition-timing-function: ease-in-out; -moz-transition-timing-function: ease-in-out; -webkit-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; transition-duration: .2s; -moz-transition-duration: .2s; -webkit-transition-duration: .2s; -o-transition-duration: .2s; }
::selection { color: #000; background:#dcdcdc; }
::-moz-selection { color:#000; background:#dcdcdc; }
::-webkit-input-placeholder { color: #999; text-overflow: ellipsis; }
:-moz-placeholder { color: #999 !important; text-overflow: ellipsis; opacity:1; }
::-moz-placeholder { color: #999 !important; text-overflow: ellipsis; opacity:1; } 
:-ms-input-placeholder { color: #999 !important; text-overflow: ellipsis; opacity:1; }
::-webkit-scrollbar { width:12px }
::-webkit-scrollbar-track { -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3); -moz-box-shadow:inset 0 0 6px rgba(0,0,0,.3); box-shadow:inset 0 0 6px rgba(0,0,0,.3); }
::-webkit-scrollbar-thumb { background:rgba(210,210,210,.8); -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.5); -moz-box-shadow:inset 0 0 6px rgba(0,0,0,.5); box-shadow:inset 0 0 6px rgba(0,0,0,.5); }
::-webkit-scrollbar-thumb:window-inactive { background:rgba(210,210,210,.4) }
.animated { -moz-transition-duration: 0s !important;  }

/* only ie7, ie9, ie10, ie11 */
@media screen\0 { input { /* ie7, ie9, ie10, ie11+ only */ padding-bottom: 19px; } }
/* Remove inner shadow from inputs on mobile iOS */

/* ===================================
    Typography
====================================== */

/* font family */
.alt-font {font-family: "Oswald",sans-serif !important;}
.main-font {font-family: 'Open Sans', sans-serif !important;}

/* heading */
h1, h2, h3, h4, h5 { text-transform: none; margin:0; padding:0; color: #000; }
h1 { font-weight:700; line-height: 45px}
h2 { font-size:24px; font-weight:400; letter-spacing:inherit; line-height: 30px}
h3 { font-size:14px; letter-spacing:inherit; font-weight:700; }
h4 { letter-spacing: 0px; font-weight:400; text-transform:none; font-size:16px; line-height: 26px}
h5 { letter-spacing: 2px; font-weight:600; font-size:11px}
h6 { font-family: 'Open Sans', sans-serif; letter-spacing: 1px; font-size: 13px; font-weight: 400; line-height: 20px}

/* section title */
.section-title{ text-transform: uppercase; font-weight: 700; font-size: 20px; letter-spacing: 2px; padding: 0 0 100px 0;}
.tab-content .section-title { border: medium none; font-size: 40px; font-weight: 100; text-transform: none; margin:2% 0 0; padding:0}
.title-gray{ border:1px solid #b5b5b5; color:#b5b5b5}
.title-white{ border:1px solid #ffffff; color:#ffffff}
h1.big { color:#ffffff; font-size:65px; font-weight:600; line-height:76px; margin-bottom:0px;}
h1.title { font-size:60px; font-weight:700; line-height:65px; margin-bottom:0px; display: inline-block;}
span.underline-bg { display: table; height: 2px; width: 100%; position: relative; top: -28px; z-index:2}
h1.big span { font-weight:300;}
.banner-content { font-size:18px; line-height:28px;}
h1.page-title { margin:95px auto 0; width: 100%; }
.highlight-title { font-family:'Oswald', sans-serif; font-weight:100; color:#000; font-size:65px; letter-spacing:0;}
.highlight-title span { font-weight:600}
.work-process-title{font-size: 12px; letter-spacing: 2px; font-weight: 600; text-transform: uppercase; color: #000; }

/* different text size */
.text-small { font-size:11px !important; line-height:15px !important;}
.text-med{ font-size:14px !important; line-height:26px !important;}
.text-large { font-size: 15px !important; text-transform: uppercase; line-height: 24px !important; letter-spacing: 2px !important;}
.text-extra-large { font-size: 16px !important; line-height: 28px !important; font-weight: 100; }
.text-extra-large strong { letter-spacing: 3px}
.text-extra-large-normal { font-weight: normal !important;}
.title-small{ font-size:20px !important; line-height:30px !important;}
.title-med{ font-size:24px !important; line-height:34px !important;}
.title-large{ font-size:28px !important; line-height:41px !important;}
.title-extra-large{ font-size:35px !important; line-height:43px !important;}

/* text color */
.white-text{ color:#FFF !important} 
.magenta-text{ color:#d94378 !important}
.orange-text{ color:#ff513b !important}
.orange-light-text{ color:#ef824c !important}
.deep-red-text{ color:#e75e50 !important}
.black-text{ color:#000 !important}
.yellow-text{ color:#e6af2a !important}
.yellow-light-text{color: #ffd200 !important}
.fast-yellow-text{ color:#f7d23d !important}
.pink-text{ color:#d9378e !important}
.light-gray-text{ color: #ababab !important}
.deep-gray-text { color: #464646 !important; }
.deep-light-gray-text { color: #878787 !important; }
.gray-text {  color:#7f7f7f !important}
.dark-gray-text { color:#373737 !important}

/* letter spacing */
.no-letter-spacing { letter-spacing: 0px !important}
.letter-spacing-1 { letter-spacing:1px !important}
.letter-spacing-2 { letter-spacing:2px !important}
.letter-spacing-3 { letter-spacing:3px !important}
.letter-spacing-4 { letter-spacing:4px !important}
.letter-spacing-5 { letter-spacing:5px !important}
.letter-spacing-6 { letter-spacing:6px !important}
.letter-spacing-7 { letter-spacing:7px !important}
.letter-spacing-8 { letter-spacing:8px !important}
.letter-spacing-9 { letter-spacing:9px !important}
.letter-spacing-10 { letter-spacing:10px !important}

/* font weight */
.font-weight-100 { font-weight:100 !important}
.font-weight-300 { font-weight:300 !important}
.font-weight-400 { font-weight:400 !important}
.font-weight-600 { font-weight:600 !important}
.font-weight-700 { font-weight:700 !important}
.font-weight-800 { font-weight:800 !important}

/* text property */
.text-transform-unset { text-transform:unset !important}
.text-decoration-underline { text-decoration:underline !important; }
.word-wrap { word-wrap: break-word}
.text-transform-none {text-transform:none !important}
.text-transform-uppercase {text-transform: uppercase !important}

/* ===================================
    Icon
====================================== */

i { color: #9a9a9a; margin: 0 3px}
.extra-large-icon {font-size:60px !important;}
.large-icon {font-size:50px !important;}
.medium-icon { font-size:40px !important; margin-bottom: 15px !important; }
.small-icon { font-size:25px !important;}
.extra-small-icon { font-size:18px !important;}

/* ===================================
    Background color
====================================== */

.bg-white{ background: #fff !important;}
.bg-yellow{ background: #e6af2a !important; }
.bg-deep-yellow{ background: #f7f5e7 !important; }
.bg-golden-yellow{ background: #c3bd86 !important; }
.bg-fast-yellow{ background: #fdd947 !important; }
.bg-dark-gray{ background: #252525 !important; }
.bg-mid-gray{ background: #d4d4d4 !important; }
.bg-black{ background: #000000 !important; }
.bg-highlight{ background: #345b8f !important; text-align:center}
.bg-green{ background: #70bd5b !important; }
.bg-gray-light { background-color: #fcfcfc !important;}
.bg-gray {background-color: #f6f6f6 !important;}
.bg-yellow-ochre { background-color: #997546 !important;}
.bg-deep-brown{ background-color: #544441 !important;}
.bg-transparent { background:transparent !important}
.bg-orange { background:#c24742 !important;}
.bg-deep-orange { background:#f15a22 !important;}
.bg-fast-orange { background:#ff513b !important;}
.bg-pink { background:#c2345f !important}
.bg-deep-red { background:#e75e50 !important}
.bg-deep-pink { background:#e53878 !important}
.bg-light-pink { background:#dc378e !important}
.bg-fast-pink { background:#ff1a56 !important}
.bg-magenta { background:#d94378 !important }
.bg-light-yellow {background:#f8f7f5 !important}
.bg-dark-green{ background:#60a532 !important;}
.bg-dark-blue { background:#3273a5 !important;}
.bg-violet { background:#6c407e !important}
.dark-section{ color: #939393 !important}
.bg-light-gray { background-color: #f8f7f7 !important; }
.bg-slider {background: rgba(27, 22, 28, 0.9)}
.parallax-gray-bg{ background: rgba(246,246,246,1)}
.bg-light-orange { background-color: #ef824c !important;}
.bg-inherit { background-color: inherit !important;}

/* opacity */
.opacity-light{ position: absolute; height: 100%; width: 100%; opacity: 0.5; z-index: 1; top:0; left: 0 }
.opacity-medium{ position: absolute; height: 100%; width: 100%; opacity: 0.7; z-index: 1; top:0; left: 0 }
.opacity-full{ position: absolute; height: 100%; width: 100%; opacity: 0.8; z-index: 1; top:0; left: 0 }

/* ===================================
    Custom
====================================== */

.center-col{ float:none !important; margin-left:auto !important; margin-right:auto !important}
/* separator */
.separator-line { height: 2px; margin: 0 auto; width: 30px; margin:7% auto}
.separator-line-thick { height: 4px; margin: 0 auto; width: 30px; margin:7% auto}
.separator-line-vertical { width:7px; height:80px; background-color:#fff; float:left; margin-right:90px;}
.slider-text .separator-line { margin:14% auto; height: 2px}
.thin-separator-line { height: 1px; width: 30px; margin:7% auto}
.vertical-separator { height:25px; width:25px; border-left:1px solid #000}
.wide-separator-line { height: 1px;  background-color:#e5e5e5; margin:5% 15px;}
.indicators-black .active { background-color: #000; border: 2px solid rgba(0, 0, 0, 1); }
.indicators-black li { border: 2px solid rgba(0, 0, 0, 1);}

/* margin */
.margin-one{ margin-top:1% !important; margin-bottom:1% !important}
.margin-two{ margin-top:2% !important; margin-bottom:2% !important}
.margin-three{ margin-top:3% !important; margin-bottom:3% !important}
.margin-four{ margin-top:4% !important; margin-bottom:4% !important}
.margin-five{ margin-top:5% !important; margin-bottom:5% !important}
.margin-six{ margin-top:5% !important; margin-bottom:0 !important }
.margin-seven{ margin-top:7.8% !important; margin-bottom:5% !important}
.margin-eight {margin-top:8% !important; margin-bottom:8% !important}
.margin-nine {margin-top:9% !important; margin-bottom:9% !important}
.margin-ten{ margin-top:10% !important; margin-bottom:10% !important}
.margin-eleven{ margin-top:22% !important; margin-bottom:22% !important}
.margin-right-four{margin-right:4% !important}
.margin-right-five{margin-right:5% !important}
.margin-right-six{margin-right:6% !important}
.margin-right-seven{margin-right:7% !important}
.margin-right-eight{margin-right:8% !important}
.margin-right-nine{margin-right:9% !important}
.margin-right-ten{margin-right:10% !important}
.margin-top-section { margin-top:96px;}
.margin-left-right-one { margin-right:6% !important; margin-left:6% !important}
.margin-two-bottom { margin-bottom: 2% !important; }
.margin-three-bottom { margin-bottom: 3% !important; }
.margin-four-bottom { margin-bottom: 4% !important; }
.margin-five-bottom { margin-bottom: 5% !important; }
.margin-six-bottom { margin-bottom: 6% !important; }
.margin-seven-bottom { margin-bottom: 7% !important; }
.margin-ten-bottom { margin-bottom: 10% !important; }
.no-margin{ margin:0 !important}
.no-margin-lr{ margin-left: 0 !important; margin-right: 0 !important}
.no-margin-top{ margin-top:0 !important}
.no-margin-bottom{ margin-bottom:0 !important}
.no-margin-left{ margin-left:0 !important}
.no-margin-right{ margin-right:0 !important}
.margin-bottom{ margin-bottom:60px}

/* padding */
.padding-one { padding-top:1% !important; padding-bottom:1% !important}
.padding-two { padding-top:2% !important; padding-bottom:2% !important}
.padding-three { padding-top:3% !important; padding-bottom:3% !important}
.padding-four { padding-top:4% !important; padding-bottom:4% !important}
.padding-five { padding-top:5% !important; padding-bottom:5% !important}
.padding-six { padding-top:3% !important; padding-left:3% !important; padding-right:3% !important;}
.padding-seven { padding:6%} 
.padding-eight { padding-top:20%; padding-bottom: 20%}
.padding-nine { padding:6% 0} 
.padding-twenty-nine{ padding:15% !important}
.padding-left-right { padding-right:6% !important; padding-left:6% !important;}
.padding-two-bottom { padding-bottom: 2% !important; }
.padding-left-right-px { padding: 0 15px;}
.no-padding-left-right { padding-left:0 !important; padding-right:0 !important}
.no-padding-section { padding:0px !important;}
.no-padding-right { padding-right:0px !important;}
.no-padding-top { padding-top:0 !important}
.no-padding{padding:0 !important}
.no-padding-left { padding-left:0px !important;}
.no-padding-bottom { padding-bottom:0 !important}
.section-padding-inner{ padding: 140px 0}

/* float */
.f-left { float:left !important}
.f-right{ float:right !important}
.no-float { float:none !important;}

/* other col size */
.col-large {width:90%;}
.col-medium {width:85%;}
.col-small{ width:75%;}
.col-extra-small{ width:70%; }

/* display */
.display-block { display: block !important}
.overflow-hidden{ overflow: hidden !important}
.overflow-hidden-mobile{ position:fixed !important; overflow: hidden !important}
.display-inline-block { display: inline-block !important}
.display-inline { display: inline !important}
.display-none { display: none !important}
.display-table { display: table !important}

/* position */
.position-relative{ position: relative !important; z-index: 5 }
.position-absolute {position: absolute !important;}
.position-right { right:0 !important; }
.position-left { left:0 !important; }
.position-top { top:0 !important; }

/* width */
.width { display: inline-block; position: relative; width: 90%; }
.width-20 { width:20% !important;}
.width-30 { width:30% !important;}
.width-40 { width:40% !important;}
.width-50 { width:50% !important;}
.width-60 { width:60% !important;}
.width-70 { width:70% !important;}
.width-80 { width:80% !important;}
.width-90 { width:90% !important;}
.width-100 { width:100% !important;}
.width-auto { width: auto !important}

/* height */
.height-100 { height: 100% !important}
.height-auto { height:auto !important}

.clear-both{ clear:both}
.roundedimage { border-radius: 100%}
.vertical-align-middle { vertical-align: middle !important;}
.vertical-align-bottom { vertical-align: bottom !important;}
.no-box-shadow { box-shadow:none !important}
p.uppercase { text-transform:uppercase !important;}
p.uppercase a { text-decoration:underline !important;}
p.uppercase a:hover { text-decoration: none;}
.line-break { display:block !important;}
.z-index-1 {z-index:1 !important;}
.z-index-0 {z-index:0 !important;}
.no-transition *, .owl-carousel * { transition-timing-function: none; -moz-transition-timing-function: none; -webkit-transition-timing-function: none; -o-transition-timing-function: none; transition-duration: 0s; -moz-transition-duration: 0s; -webkit-transition-duration: 0s; -o-transition-duration: 0s; }
/* ===================================
    Border
====================================== */

.white-round-border { border-radius: 50%; border: 1px solid #fff;}
.border-black{ border:1px solid #000}
.border-thick{ border-width:2px !important }
.border-white { border:1px solid #FFF}
.border-top { border-top: 1px solid #e5e5e5; }
.border { border: 1px solid #e5e5e5;  }
.border-right { border-right: 1px solid #e5e5e5; }
.border-bottom { border-bottom: 1px solid #e5e5e5; }
.border-left { border-left: 4px solid #fff; }
.border-color-black { border-color: #000 !important}
.border-color-white { border-color: #fff !important}
.border-gray { border-color:#d7d7d7 !important}
.border-color-orange { border-color:#ff513b !important}
.no-border { border:none !important}
.border-top-light { border-top: 1px solid rgba(0, 0, 0, 0.1);}
.border-bottom-light { border-bottom: 1px solid rgba(0, 0, 0, 0.1);}
.border-transperent-light { border-color:rgba(255,255,255,.25) !important}
.no-border-round {border-radius:0 !important}

/* ===================================
    Scroll to top
====================================== */

#scroll_to_top { cursor: pointer; }
#scroll_to_top:hover { opacity: 0.75; }
.scrollToTop { display: block; font-weight: bold; height: auto; padding: 12px 14px; position: fixed; right: 30px; text-align: center; text-decoration: none; bottom: 30px; top: auto; width: auto; background-color: #000; z-index: 555; border-radius: 4px; }
.scrollToTop i { font-size: 24px; margin: 0; color: #fff; }
.scrollToTop:hover { opacity: 0.5; }
.scrollToTop:hover i { position: relative; }

/* ===================================
    Slider background and overlay
====================================== */

.slider-overlay{ position: absolute; height: 100%; width: 100%; opacity: 0.6; z-index: 1; top:0; left: 0 }
.video-background{ position: absolute; height: 100%; width: 100%; z-index: 1; top:0; background: rgba(67,67,67,0.5) }
.slider-overlay-half{ position: absolute; height: 60%; width: 100%; opacity: 0.9; z-index: 1; bottom:0; }
.slider-text { position: relative; left:0px; right:0px; z-index:1}
.slider-text h1 { font-size:30px; font-weight:300; letter-spacing:3px; font-family: 'Oswald', sans-serif; line-height: 38px}
.slider-text span {display: block; font-size: 16px; font-weight: 400; line-height: 25px; }
.gradient-overlay { position: absolute; height: 100%; width: 100%; opacity: 0.8; z-index: 1; top: 0px; background: rgba(167,73,28,0.9); background: -moz-linear-gradient(left, rgba(167,73,28,0.9) 0%, rgba(48,41,39,0.9) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(167,73,28,0.9)), color-stop(100%, rgba(48,41,39,0.9))); background: -webkit-linear-gradient(left, rgba(167,73,28,0.9) 0%, rgba(48,41,39,0.9) 100%); background: -o-linear-gradient(left, rgba(167,73,28,0.9) 0%, rgba(48,41,39,0.9) 100%); background: -ms-linear-gradient(left, rgba(167,73,28,0.9) 0%, rgba(48,41,39,0.9) 100%); background: linear-gradient(to right, rgba(167,73,28,0.9) 0%, rgba(48,41,39,0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d9a562', endColorstr='#608aab', GradientType=1 ); }
.gradient-overlay-light { background: rgba(176,0,92,1); background: -moz-linear-gradient(left, rgba(176,0,92,1) 0%, rgba(83,11,49,1) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(176,0,92,1)), color-stop(100%, rgba(83,11,49,1))); background: -webkit-linear-gradient(left, rgba(176,0,92,0.7) 0%, rgba(83,11,49,1) 100%); background: -o-linear-gradient(left, rgba(176,0,92,0.7) 0%, rgba(83,11,49,1) 100%); background: -ms-linear-gradient(left, rgba(176,0,92,0.7) 0%, rgba(83,11,49,1) 100%); background: linear-gradient(to right, rgba(176,0,92,1) 0%, rgba(83,11,49,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#530b31', endColorstr='#b0005c', GradientType=1 ); }
.overlay-yellow{ position: absolute; height: 100%; width: 100%; opacity: 0.7; top: 0px; background-color:#ffca18 }
.overlay-blue{ position: absolute; height: 100%; width: 100%; opacity: 0.7; top: 0px; background-color:#8ac4fe }
.overlay-gray{ position: absolute; height: 100%; width: 100%; opacity: 0.8; top: 0px; background-color:#f4f5f6 }
.overlay-green{ position: absolute; height: 100%; width: 100%; opacity: 0.7; top: 0px; background-color:#71f1b9 }
.slider-half { position:absolute; top:50%; left:0; right:0; z-index:1; color:#FFF}
.slider-half h1 { font-size:80px; line-height:85px; font-weight:300; letter-spacing:-2px; text-transform: none;}
.slider-half h1 span { font-weight:700;}

/* ===================================
    Navigation
====================================== */

nav { width: 100%; top: 0px; z-index: 99;}
nav .container{ display: table-cell; vertical-align: middle; height: 80px; position: relative; }
.shrink-nav .container { height: 60px; }
.shrink-nav { background-color:#FFF; }
.sticky-nav{ position: fixed; top: 0px; display: inline-table;}
.logo { max-width: 109px; }
.logo-style-2 { max-width: 177px; }
.logo-style-3 { max-width: 210px; }
.sticky-nav .logo-light { height: 55px; vertical-align: middle; display: table-cell;}
.shrink-nav .logo-light { opacity: 0; display: none}
.sticky-nav .logo-dark {opacity: 0; display: none}
.shrink-nav .logo-dark { height: 55px; vertical-align: middle; display: table-cell; opacity: 1}
.mega-menu-full .mega-menu-column { margin: 0; }
.navbar-nav li a.active { border-bottom:2px solid #000}
.nav-white-bg { background-color:#fff !important;}
.black-bg { background: rgba(0,0,0,0.65)}
.nav-white.sticky-nav .navbar-nav li a { color: #fff}
.nav-white.shrink-nav .navbar-nav li a { color: #000}
.nav-white.sticky-nav .navbar-nav li a:hover, .nav-white.sticky-nav .navbar-nav > .open > a  { border-bottom-color: #fff}
.nav-white.shrink-nav .navbar-nav li a:hover, .nav-white.shrink-nav .navbar-nav > .open > a { border-bottom-color: #000}
.nav-dark.shrink-nav .navbar-nav li a:hover, .nav-dark.shrink-nav .navbar-nav > .open > a { border-bottom-color: #fff !important}
.nav-dark-transparent.shrink-nav .navbar-nav li a:hover, .nav-dark-transparent.shrink-nav .navbar-nav > .open > a { border-bottom-color: #fff !important}
.navbar-default .navbar-nav > li > a i { display: none; }
.mega-menu-full { -webkit-transform: translateX(0); -moz-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
.mega-menu-column { display: inline-block; margin-right: 35px; vertical-align: top; }
.mega-menu-column:last-child { margin-right: 0; }
.sticky-nav .navbar-nav > li > .dropdown-menu { top: 66px; }
.shrink-nav .navbar-nav > li > .dropdown-menu { top: 55px; }
.shrink-nav .dropdown.simple-dropdown .dropdown-menu { top: 45px !important}
.shrink-nav .cart-content { top: 44px; }
.nav li.simple-dropdown { position: relative;}
.dropdown.simple-dropdown .dropdown-menu { left: -10px; transform: translateX(0px); padding-top: 30px; top: 56px !important }
.full-width-pull-menu {display: inline-table\9 !important;}
.full-width-pull-menu .container {display:table-cell\9 !important;}
.menu-new{ background:#c11f1f; padding:0 6px 1px 5px; font-size:10px; color:#fff; margin-left:5px;}
.megamenu-right-icon { display: none !important; }

/*  simple dropdown menu    */
.simple-dropdown-menu ul { padding: 0 !important; }
.simple-dropdown-menu ul li { }
.simple-dropdown-menu ul li a { border-bottom: 1px solid rgba(255, 255, 255, 0.06); height: 38px; line-height: 36px; padding: 0 13px; }
.simple-dropdown-menu ul li a:hover { background-color: rgba(0, 0, 0, 0.3); }
.sub-menu { position: relative; width: 100%; }
.sub-menu ul { background-color: rgba(27, 22, 28, 0.95); border-left: 1px solid rgba(255, 255, 255, 0.06); display: none; left: 200px; margin: 0 !important; min-width: 200px; padding: 10px 25px 35px; position: absolute; top: 0; }
.sub-menu:hover ul { display: block; }
.sub-menu a i { position: absolute !important; top: 11px !important; }

.dropdown-menu li a i { color: #c8c8c8 ; float: left; font-size: 14px; margin: 0 10px 0 0; padding: 0; position: relative; right: 0; top: 5px; }
.dropdown-menu li a:hover i { color: #fff; }
.sticky-nav.nav-border-bottom { border-bottom: 1px solid rgba(0,0,0,0)}
.shrink-nav.nav-border-bottom { border-bottom: 1px solid rgba(0,0,0,0.1)}
.nav-border-bottom-fix {border-bottom: 1px solid rgba(0,0,0,0.1)}

.nav-white .search-cart-header .subtitle, .nav-white .top-cart .fa-shopping-cart, .nav-white .search-button, .nav-white .top-cart a:hover .fa-shopping-cart  { color: #fff}
.nav-white.shrink-nav .search-cart-header .subtitle, .nav-white.shrink-nav .top-cart .fa-shopping-cart, .nav-white.shrink-nav .search-button, .nav-white.shrink-nav .top-cart a:hover .fa-shopping-cart  { color: #000}

/*  dark navigation  */
.nav-dark { background-color: #000; border-bottom:1px solid rgba(0,0,0,1)}
.nav-dark.shrink-nav .navbar-nav li a { color:#fff}
.nav-dark .search-cart-header .subtitle, .nav-dark .top-cart .fa-shopping-cart, .nav-dark .search-button, .nav-dark .top-cart a:hover .fa-shopping-cart  { color: #fff !important}
.nav-dark .search-button { color:#fff !important}
.nav-dark .dropdown-menu, .nav-dark .cart-content{ background: rgba(0,0,0,0.9)}
.nav-dark .navbar-nav li a:hover { border-bottom-color: #fff}
.nav-dark li a.active { border-bottom:2px solid #fff !important}

/*  transparent dark navigation  */
.nav-dark-transparent { background-color: rgba(0,0,0,0.8); border-bottom:1px solid rgba(0,0,0,0.8)}
.nav-dark-transparent.shrink-nav .navbar-nav li a { color:#fff }
.nav-dark-transparent .search-cart-header .subtitle, .nav-dark-transparent .top-cart .fa-shopping-cart, .nav-dark-transparent .search-button, .nav-dark-transparent .top-cart a:hover .fa-shopping-cart  { color: #fff !important}
.nav-dark-transparent .dropdown-menu, .nav-dark-transparent .cart-content { background: rgba(0,0,0,0.9)}
.nav-dark-transparent .navbar-nav li a:hover { border-bottom-color: #fff !important}
.nav-dark-transparent .close-search, .nav-white .close-search{ color: #000 !important}

/*  transparent light navigation  */
.nav-light-transparent{ background-color: rgba(255,255,255,0.8)}

/*  static sticky  */
.static-sticky { height: 87px !important}
.static-sticky .logo-light { opacity: 1; display: block; display: table-cell; vertical-align: middle; }
.static-sticky .navbar-nav > li > .dropdown-menu { top: 69px; }
.static-sticky .dropdown.simple-dropdown .dropdown-menu { top: 60px !important}
.static-sticky.shrink-nav .dropdown.simple-dropdown .dropdown-menu { top: 60px !important;}
.static-sticky .cart-content { margin-top: 6px !important; top: 52px !important;}

/* pull menu */
.pull-menu .navbar-header { background: none}
.pull-menu .navbar-brand {height: auto}
.pull-menu img {max-width:150px}
.pull-menu .navbar-nav {padding: 40px 0;}
.pull-menu .navbar-nav a { color: #a5a5a5 !important; font-weight: 600; line-height:35px; padding:3px 0 0; border-bottom:1px solid rgba(255,255,255,.2)}
.pull-menu .navbar-nav li a.active {border-bottom: 1px solid rgba(255,255,255,.6); color: #fff !important}
.pull-menu .nav li {margin:0; display: block; width: 100%; }
.pull-menu .navbar-nav a span { color: #a9a9a9; margin-right: 10px;}
.pull-menu .navbar-nav li.active a { color: #000 !important}
.pull-menu .navbar-nav li.active a span { color: #e31d3b !important}
.pull-menu .footer-social a i {font-size: 14px; color: #fff}
.pull-menu .footer-social a {margin: 0 10px !important}
.pull-menu nav.shrink {background: #fff}

/* full width pull menu */
.full-width-pull-menu .menu-button {margin:0}
.show-menu .full-width-pull-menu .menu-wrap {opacity: 1; display: block; top: 0; }
.full-width-pull-menu .menu-wrap {width: 100%; opacity: 0; display: none; left: 0; top:-50px; height: 100%; overflow: auto}
.full-width-pull-menu .close-button {height: 64px; width: 64px; background: transparent;}
.full-width-pull-menu .close-button::before, .full-width-pull-menu .close-button::after {background: #000;}
.full-width-pull-menu .menu-wrap { background: rgba(255,255,255,1)}
.full-width-pull-menu .pull-menu .navbar-nav {padding:0 0 100px 0}
.full-width-pull-menu .pull-menu .navbar-nav {text-align: center; width: 100%;}
.full-width-pull-menu .navbar-nav li a { font-size: 30px; line-height: 45px; padding: 0; color: #000 !important; font-weight: 700 }
.full-width-pull-menu .navbar-nav li a:hover {color: #797979 !important}
.full-width-pull-menu .navbar-nav li a.active {color: #797979 !important}
.full-width-pull-menu .navbar-nav li a.dropdown-toggle:after { content:"\f106"; font-family:'FontAwesome'; font-size: 26px; position: relative; left: 8px; top: -2px; font-weight: 100; }
.full-width-pull-menu .navbar-nav li a.dropdown-toggle.collapsed:after { content:"\f107"; font-family:'FontAwesome'; font-size: 26px; position: relative; left: 8px; top: -2px; font-weight: 100; }
.full-width-pull-menu .navbar-nav .dropdown-menu li ul { margin: 20px;}
.full-width-pull-menu .pull-menu .navbar-nav a, .full-width-pull-menu .pull-menu .navbar-nav li a.active, .full-width-pull-menu .pull-menu .navbar-nav li a:hover  { border-bottom: 0; display: inline-block}
.full-width-pull-menu .dropdown-menu {position:relative; top:0 !important; width: 100% !important;; text-align: center}
.full-width-pull-menu .dropdown-menu li a {font-size: 12px; line-height: 30px; font-weight: 400;}
.full-width-pull-menu .navbar-toggle { display:block}
.full-width-pull-menu .open .dropdown-menu {display: block; }
.full-width-pull-menu .dropdown .collapse { opacity: 0; margin:0 !important}
.full-width-pull-menu .dropdown .collapse.in {opacity: 1; margin:0 !important}
.full-width-pull-menu .pull-menu-open {display:table; height: 100%; width:100%}
.full-width-pull-menu .pull-menu-open-sub {display: table-cell; vertical-align: middle; height: 100%}

.full-width-pull-menu-dark .navbar-nav li a {   color: #000 !important; display: inline-block !important; font-size: 20px; font-weight: 600; letter-spacing: 3px; line-height: 45px; padding: 0;}
.full-width-pull-menu-dark .navbar-nav li a:hover, .full-width-pull-menu-dark .pull-menu .navbar-nav li a.active {color: #bbbbbb !important}
.full-width-pull-menu-dark .close-button::before, .full-width-pull-menu-dark .close-button::after {background: #000; height: 25%; left: 45%; top: 45%; width: 3px; }
.full-width-pull-menu-dark .pull-menu {height: 100%; position: fixed; overflow-y: scroll;}
.full-width-pull-menu-dark .pull-menu .navbar-nav {text-align: left;}
.full-width-pull-menu-dark .menu-number { color: #bbbbbb; font-size: 14px; font-weight: 400; margin-right: 15px; }
.full-width-pull-menu-dark .pull-menu-open-sub {padding-left:100px;}
.full-width-pull-menu-dark .btn {margin-right: 10px;}


/*  non sticky  */
.non-sticky {position: relative;}

/* header without cart search section */ 
.header-without-cart-search .dropdown-menu { right:15px}
.header-without-cart-search .dropdown.simple-dropdown .dropdown-menu { left: auto !important; right: 0 !important;}
.header-without-cart-search .navbar-right .dropdown-menu {left:auto; right: 15px;}

/* search and cart */
.search-cart-header { padding-top: 14px; float: right; letter-spacing: 1px}
#top-search { float: right; margin: 1px 0 0 18px; position: relative; padding-bottom: 17px;}
.search-form {width:45%; margin: 0 auto; top:40%}
.search-form .search-input { border:none; border-bottom:2px solid #000; font-size:30px; font-weight:100; padding:20px 2px; text-transform:capitalize; background: transparent; line-height:40px; }
.search-form .search-input:focus{outline: none}
.search-input ::-moz-placeholder, .search-input [placeholder] { color: #ff0000 !important; }
.search-form .search-button {font-size:21px; color:#000; top:31px; right: 0}
#search-header {height:100%}
.close-search { color: #373737; position: absolute; right: 0; top: 23px; z-index: 998; cursor: pointer; }
.close-search:hover { color: #9a9a9a;}
.search-button { cursor: pointer;  z-index: 0; color: #373737; margin-right: 0; border: none; background: none; }
.search-cart-header i { display: initial; }
.search-button:hover { color: #9a9a9a;}
.top-cart { float:right; position: relative; padding-bottom: 17px;}
.top-cart a.shopping-cart { color: #373737; display: initial; padding-bottom: 30px;}
.top-cart a.shopping-cart:hover { color: #373737;}
.top-cart .fa-shopping-cart { margin: 5px 4px 0 0; color: #373737;}
.top-cart a:hover .fa-shopping-cart { color: #373737;}
.search-cart-header .subtitle { color: #373737; display: inline-block; font-size: 11px; font-weight: 600; margin-top: 1px; text-transform: uppercase; }
.cart-content { top: 55px; opacity: 0; position: absolute; right: 0; transition: all 200ms ease 0s; visibility: hidden; z-index: 9; background-clip: padding-box; background-color: rgba(27, 22, 28, 0.95); padding:25px; width: 250px;  }
.cart-content ul.cart-list { list-style: outside none none; margin: 0; padding: 0; float: left; width: 100%; color: #c8c8c8 }
.cart-content ul.cart-list li { min-height: 85px; text-align: left; }
.cart-content ul.cart-list a.remove { position: absolute; right: 15px; text-align: right;}
.cart-content ul.cart-list a { display: block; font-size: 11px; text-transform: uppercase; font-weight: 600; line-height: 16px; padding: 0 0 0 70px; position: relative; width: auto; color: #c8c8c8 !important }
.cart-content ul.cart-list a img { height: 60px; left: 0; float: left; width: 60px; position: absolute; }
.cart-content ul.cart-list .quantity { font-size: 12px; margin-left: 70px; }
.cart-content .total { border-bottom: 1px solid rgba(255,255,255,0.2); border-top: 1px solid rgba(255,255,255,0.2); color: #c8c8c8; display: block; font-size: 11px; margin-bottom: 0; padding: 7px 0; float: left; width: 100%; text-transform: uppercase }
.cart-content p.total strong { float: left; }
.cart-content .total .amount { float: right; }
.cart-content .buttons {float: left; width: 100%; margin: 0px; text-align: center }

/* ===================================
    Page titles
====================================== */

/* page titles */
.content-top-margin { margin-top: 81px;}
.page-title { padding: 80px 0}
.page-title h1 { letter-spacing: 6px; font-weight: 600; font-size: 20px; margin-bottom: 5px}
.page-title span {letter-spacing: 1px; font-weight: 400; font-size: 14px;}
.breadcrumb ul li { display: inline-block; letter-spacing: 3px; font-size: 11px; font-weight: 400; color: #575757}
.breadcrumb ul li a { color: #575757}
.breadcrumb ul > li+li:before {  color: #898989; content: "|"; font-size: 8px; padding: 0 10px; position: relative; top: -1px;}
.page-title-large { min-height: 450px; padding: 240px 0 0}
.page-title-large h1 { font-size: 25px !important; margin-bottom: 15px !important;}
.page-title .breadcrumb { margin-top: 36px}
.page-title .separator-line { -webkit-transition: all 100ms ease-in-out; -moz-transition: all 100ms ease-in-out; -o-transition: all 100ms ease-in-out; -ms-transition: all 100ms ease-in-out; transition: all 100ms ease-in-out;}
.page-title:hover .separator-line { width:80px; -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; transition: all 400ms linear;}

/* page title shop */
.page-title-shop h1 { font-size:35px !important;}

/* page titels small */
.page-title-small { padding: 40px 0 }
.page-title-small h1 { margin-bottom: 0; font-size: 18px; line-height: 23px}
.page-title-small .breadcrumb { margin-top:0; }

/* ===================================
    Section
====================================== */


/* testimonial section */
.testimonial p{ font-size:14px; margin:50px 0 40px; line-height:24px}
.testimonial .name{ font-size:11px; display:block; margin:0 0 10px 0; width:100%; font-weight:400; text-transform: uppercase; letter-spacing: 2px; color: #737373}

.testimonial-style2 p{ font-size:13px; margin:30px 0 20px; line-height:22px; color: #828282}
.testimonial-style2 .name{ font-size:11px; display:block; width:100%; font-weight:600; text-transform: uppercase; letter-spacing: 2px; color: #828282}
.testimonial-style2 img { border-radius: 50%; max-width: 120px}

.tab-content > .tab-pane .top-icon { display:block;}
.tab-content > .tab-pane .top-icon i { color: #5bcf21; font-size:70px;}

/* counter section  */
.counter-section i { display:block; margin:0 0 10px}
.counter-section span.counter-number { font-size:40px; color:#000; line-height:60px; display:block; font-family: "Oswald",sans-serif; letter-spacing: 2px}
.counter-title{ font-size:12px; letter-spacing:2px; text-transform: uppercase}
.counter-icon {top:25px; position:relative}
.counter-style2 .counter-title {letter-spacing: 0.55px; float: left;}
.counter-style2 span.counter-number {letter-spacing: 0.55px; float: left; margin-right: 10px;}
.counter-style2 i {float: right; line-height: 26px; margin: 0 10px 0 0}
.counter-subheadline span {float: right;}


/* case study */
.case-study-slider{ padding: 130px 0}
.case-study-title { font-size: 18px; letter-spacing: 3px; text-transform: uppercase; font-weight: 600}
.case-study-work {letter-spacing: 3px; font-size: 11px; font-weight: 600; text-transform: uppercase; display: block; margin: 5px 0 25px;}
.case-study-detials{ display: block; margin-bottom: 25px; }
.case-study-img { min-height: 500px;}
.case-study-details { min-height: 500px; padding: 6.3% 6%;}


/* ===================================
    Footer
====================================== */

footer { clear:both; background: #f4f4f4}
footer .bg-mid-gray { background: #d5d5d5}
footer .footer-top {border-top:1px solid #e5e5e5 }
footer h5 { margin-bottom: 20px;}
footer .footer-middle { padding-top:80px; padding-bottom: 45px; width: 100%;}
footer .onepage-footer-middle { padding-top:55px; padding-bottom: 45px;}
footer ul li { padding: 1px 0}
footer ul li a { color: #626262; font-size: 11px; text-transform: uppercase; letter-spacing: 1px}
footer ul li a:hover { color: #000}
footer ul.list-inline li a { color: #000; font-weight: 600}
footer ul.list-inline li:first-child {padding-left: 6px}
.footer-social i {  font-size: 22px;}
.footer-social a { margin: 0 25px;}
.footer-social a:last-child {margin-right: 0}
.footer-social a i {color: #000; }
.footer-social a:hover i { color: #868686}
.copyright { font-size: 11px; text-transform:uppercase; color: #888888 }
.footer-logo img { max-width: 100px;}
.footer-bottom { position: relative; top:1px}

/* ===================================
    Hero background
====================================== */

.hero-bg { background-position: center center; background-repeat: no-repeat; background-size: cover; display: block; overflow: hidden; position: relative; width: 100%; }

/* ===================================
    Slider and parallax typography
====================================== */

.slider-text-middle-main { display: table; height: 100%; width: 100% }
.slider-text-bottom { display: table-cell; vertical-align: bottom; }
.slider-text-top { display: table-cell; vertical-align: top; }
.slider-text-middle { display: table-cell; vertical-align: middle; }
.slider-text-middle1 { padding: 0 15px;}
.slider-typography { text-align: center; width: 100%; height: 100%; position: absolute; z-index: 1; right: 0; left: 0; }
.slider-subtitle1 { background-color: #000; display: block; font-family: "Oswald",sans-serif; font-size: 48px; font-weight: 100; letter-spacing: 4px; line-height: 68px; margin-bottom: 45px; padding: 30px 35px; text-align: center; text-transform: uppercase; width: 250px; }
.slider-title-big1 {font-size: 14px; text-transform: uppercase; letter-spacing: 1px }
.slider-text-middle1 .separator-line { margin: 3% 0 0 0}
.slider-text-middle2 { padding:0 15px}
.slider-subtitle2 { display: block; font-family: "Oswald",sans-serif; font-size: 35px; font-weight: 100; letter-spacing: 4px; line-height: 45px; text-transform: uppercase; }
.slider-subtitle3 {font-size: 20px; font-weight: 600; letter-spacing: 8px; line-height: 80px; text-transform: uppercase; }
.slider-text-middle3 { padding:0 15px}
.slider-title-big3 {background:#000; display: inline-block; font-size: 30px; font-weight: 600; letter-spacing: 7px; line-height: 43px; padding: 35px 50px; text-transform: uppercase;}
.slider-text-middle4 { padding: 0 15px;}
.slider-subtitle4 {font-size: 14px; font-weight: 100; letter-spacing: 4px; text-transform: uppercase; margin-bottom: 20px; display: block }
.slider-title-big4 {font-family: "Oswald",sans-serif;  font-size: 30px; font-weight: 400; letter-spacing: 7px; text-transform: uppercase; display: block; margin-bottom: 20px}
.slider-text-middle5 { padding: 0 15px;}
.slider-subtitle5 {font-size: 22px; font-weight: 600; letter-spacing: 4px; text-transform: uppercase; margin-bottom: 50px; display: block; line-height: 30px }
.slider-title-big5 {font-family: "Oswald",sans-serif;  font-size: 15px; font-weight: 100; letter-spacing: 7px; text-transform: uppercase; display: block; margin-bottom: 30px}
.slider-number {border: 2px solid #fff; color: #fff; display: inline-block; font-family: "Oswald",sans-serif; font-size: 20px; font-weight: 400; margin-bottom: 60px; padding: 9px 0; width: 46px; text-align: center}
.slider-title-big6{ font-size:110px;}
.slider-title-big7{ font-size:55px; line-height: 68px; font-weight: 300; color: #fff; display: inline-block;}
.slider-title-big8 {font-family: "Oswald",sans-serif;  font-size: 25px; line-height: 35px; font-weight: 300; letter-spacing: 1px; text-transform: uppercase; display: block;}

/* ===================================
    Parallax
====================================== */

.overlay{ position: absolute; height: 100%; width: 100%; opacity: 0.2; z-index: 1; top: 0px; }
.parallax-fix{ position: relative; background-size: cover !important; overflow: hidden; background-position: center center; background-repeat: no-repeat !important; transition-duration: .2s; -moz-transition-duration: .2s; -webkit-transition-duration: .2s; -o-transition-duration: .2s; transition-timing-function: ease-in; -moz-transition-timing-function: ease-in; -webkit-transition-timing-function: ease-in; -o-transition-timing-function: ease-in; background-attachment: fixed !important }
.parallax-fix .row{ position: relative; z-index: 2; }
.parallax-section-main { /* min-height: 700px; */ }
.parallax-title { display: block; font-family: "Oswald",sans-serif; font-size: 15px; font-weight: 100; letter-spacing: 7px; margin-bottom: 30px; text-transform: uppercase; }
.parallax-sub-title{  display: block; font-size: 22px; font-weight: 600; letter-spacing: 4px; line-height: 30px; text-transform: uppercase; }
.parallax-number { border: 2px solid #000; color: #000; display: inline-block; font-family: "Oswald",sans-serif; font-size: 20px; font-weight: 400; margin:150px 0 60px 0; padding: 9px 0; width:47px; text-align: center; letter-spacing: -2px }
.fix-background{ position: relative; background-size: cover !important; overflow: hidden; background-position: center center; background-repeat: no-repeat !important; background-attachment: fixed !important}
.cover-background{ position: relative; background-size: cover !important; overflow: hidden; background-position: center center; background-repeat: no-repeat !important;}
.background-size-inherit {background-size: inherit !important}
.blog-blockquote { padding:100px}
.background-attachment-inherit {background-attachment: inherit !important}



/* ===================================
    Blog
====================================== */


/* blog pagination */
.pagination { text-align: center; width: 100%; margin: 40px 0 0 0}
.pagination a { margin: 0 25px; font-size: 14px; margin-right: 10px; color: #7a7a7a }
.pagination a.active  { border-bottom: 1px solid #000; font-weight: 600; color: #000}
.pagination a:hover { color: #000}
.pagination i { color: #000; font-size: 17px;}



/*  side bar */
.widget { margin-bottom:65px;}
.widget input { border-radius: 4px; width: 85%; border-width: 2px; margin-bottom: 0; padding: 10px 35px 10px 15px }
.tags a { border:1px solid rgba(0, 0, 0, 0.1); padding: 0 10px; margin: 0 5px 9px 0; text-transform: uppercase; font-size: 10px; color: #626262; display: inline-block; line-height: 26px; }
.tags a:hover {border:1px solid rgba(0, 0, 0, 1); background-color: #000; color: #fff}


/*  only ie9, ie10, ie11 */
@media screen\0 { .widget input { /* ie7, ie9, ie10, ie11+ only */ padding-bottom: 17px; } }


/* ===================================
    Portfolio
====================================== */

/* portfolio filter */
.grid-wrap .tab-content { margin-top: 25px; }



/* masonry basic */
.grid li  {transition-duration: 0s; -moz-transition-duration: 0s; -webkit-transition-duration: 0s; -o-transition-duration: 0s;}
.grid img { width:100%}
.grid-gallery { clear: both; float: left; width: 100%; }
.gallery-img a { position: relative; z-index: 2; display: block}
.grid-gallery ul { list-style: none; padding: 0; }
.grid-gallery figure { margin: 0; position: relative }
.grid-gallery figure img { display: block; width: 100%; opacity: 1; cursor: pointer; }
.grid-gallery figcaption h3 { margin: 0 0 8px; padding:0; text-transform:uppercase; }
.grid-gallery figcaption i { font-size: 32px; color: #aeaeae; margin-bottom: 20px}
.grid-gallery figcaption h3 a, .grid-gallery figcaption h3 { letter-spacing: 4px; font-weight: 400; color: #e3e3e3}
.grid-gallery figcaption p { display:block; font-size:12px; letter-spacing:3px; text-transform:uppercase; text-decoration:none; color: #aeaeae; margin-bottom: 0 }
.grid { margin: 0 auto; }
.grid li { box-sizing: border-box; float: left; margin: 0; width: 25%; display: inline-table;  }
.grid figure { -webkit-transition: opacity 0.2s; transition: opacity 0.2s; }
.grid figcaption {  bottom: 70px; opacity: 0; position: absolute; text-align: center; width: 100%; transition: all .3s ease; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; }
.gallery-img { opacity: 1; transition: all 0.3s ease 0s; overflow: hidden; }
.grid figure:hover .gallery-img {background-color:#000; }
.no-hover figure:hover .gallery-img {background-color: transparent !important; }
.no-hover figure:hover img { opacity: 1 !important; -ms-transform: none; -webkit-transform: none;  transform: none; }
figure:hover img { -ms-transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1);  transform: scale(1.1,1.1); transition: all .3s ease; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; opacity:0.15;  cursor:url("http://static.tumblr.com/cah6mnn/deJo6wjaw/icon-zoom-white.png"), pointer; }
.mfp-figure figure:hover img { cursor: pointer}
.grid figure:hover figcaption { opacity: 1; transition: all .3s ease; -webkit-transition: all .3s ease; -moz-transition: all .3s ease;}



/* portfolio grid */


/* portfolio grid - 4 column  */
.work-4col .grid li { float: left; width: 25%; }
.work-4col .grid figcaption {  bottom: 40px; }
#portfolio.work-4col .grid figcaption {  bottom: 60px; }
.work-4col .grid-gallery figcaption h3 { font-size: 13px; margin: 0 0 3px}
.work-4col .grid-gallery figcaption p { font-size: 11px}

/* portfolio grid - gutter */
.gutter .grid-gallery ul { margin-left: -14px}
.gutter .grid li { padding: 0 0 14px 14px;}


/* portfolio grid - wide */
.work-4col.wide .grid figcaption { bottom: 60px}


/* portfolio grid - wide with title */
.work-4col.wide-title .grid figcaption { bottom: 0;}


/* portfolio masonry adjustment */
.grid-gallery ul { margin-left:1px; }


/* ===================================
    Elements
====================================== */

/* accordions */
.panel > div {transition-duration: .2s; -moz-transition-duration: .2s; -webkit-transition-duration: initial; -o-transition-duration: .2s; }
.panel-heading {padding-bottom:15px; }
.panel-title { background-color: #fff; color: #767676; font-size: 12px; letter-spacing:2px; font-weight: 400; width:100%; display: block; padding: 10px 18px; border: 1px solid rgba(0,0,0,.1); text-transform: uppercase}
.panel-body { padding:10px 18px 25px 18px; font-size: 13px; line-height: 23px;}
.panel-heading i { font-size:10px; margin: 0}
.active-accordion .panel-title{ color: #000}


/* buttons */
.btn {display: inline-block;  margin-right: 20px; letter-spacing: 2px; border:1px solid transparent }
.btn-round { border-radius:4px !important}
.btn i { margin-right:5px}
.btn.btn-large i { font-size: 24px;}

.button { margin-top:0; margin-bottom: 0}
.btn.btn-large { font-size: 18px; padding: 18px 35px;}
.btn.btn-medium { font-size: 14px; padding: 10px 22px;}
.btn.btn-small { font-size: 11px; padding: 2px 14px; letter-spacing:1px}
.btn.btn-very-small {font-size: 9px; padding: 1px 12px; letter-spacing:1px}

.highlight-button { border:2px solid #000; display: inline-block; padding: 8px 20px 9px; font-size: 12px; color:#000; background-color: transparent;   }
.highlight-button:hover { background-color: #000; border: 2px solid #000; color:#fff}
.highlight-button i { color: #000}
.highlight-button:hover i {color:#fff}

.highlight-button-dark { border:2px solid #000; display: inline-block; padding: 8px 20px 9px; font-size: 12px; color:#fff; background-color: #000;  }
.highlight-button-dark:hover { background-color: transparent; border: 2px solid #000; color:#000}
.highlight-button-dark i { color: #fff}
.highlight-button-dark:hover i {color:#000}

.btn-small-white-background { font-size: 11px; letter-spacing: 2px; padding: 6px 23px; color: #000; margin-right: 25px; background:#fff; border: 2px solid #fff }
.btn-small-white-background:hover { background:transparent; border: 2px solid #fff; color: #fff; }
.btn-small-white-background i { color: #000}
.btn-small-white-background:hover i { color: #fff}

.btn-small-white { font-size: 11px; letter-spacing: 3px; padding: 6px 25px; border: 2px solid #fff; color: #fff;}
.btn-small-white:hover { background-color: #FFF; color: #000}

.btn-small-white-dark { font-size: 11px; letter-spacing: 3px; padding: 6px 25px; border: 2px solid #fff; color: #000; background:#fff}
.btn-small-white-dark:hover { background-color:transparent; color: #fff; border: 2px solid #fff}

.btn-very-small-white { font-size: 9px; letter-spacing: 2px; padding: 2px 15px; border: 1px solid #fff; color: #fff;}
.btn-very-small-white:hover { background-color: #FFF; color: #000}

.btn-black{ border: 2px solid #000; color: #fff; display: inline-block; background-color: #000; padding: 7px 20px 8px; width: auto;}
.btn-black:hover {border: 2px solid #000; color: #000; background-color: transparent}

.highlight-button-black-border{ border: 4px solid #000; background-color: transparent; font-size: 22px; padding: 20px 30px; color: #000; font-weight: 700}
.highlight-button-black-border:hover { border: 4px solid #000; background-color: #000; color: #fff}

.highlight-button-orange-border{ border: 5px solid #ef824c !important; background-color: transparent; font-size: 16px;  letter-spacing: 0 !important; padding: 10px 30px; color: #000; font-weight: 700}
.highlight-button-orange-border:hover {border: 5px solid #ef824c; background-color: #ef824c; color: #fff;}

.highlight-button-white-border{ border: 4px solid #fff; background-color: transparent; font-size: 22px; padding: 20px 30px; color: #fff; font-weight: 700}
.highlight-button-white-border:hover { border: 4px solid #fff; background-color: #fff; color: #000}

.highlight-button-black-background{ border: 4px solid #000; background-color: #000; font-size: 20px; padding: 20px 30px; color: #fff; font-weight: 700}
.highlight-button-black-background:hover { border: 4px solid #000; background-color: #fff; color: #000}

.btn-small-black-background { font-size: 11px; letter-spacing: 3px; padding: 6px 25px; border: 2px solid #000; color: #fff; background-color: #000 }
.btn-small-black-background:hover { background-color:transparent; color: #000; border: 2px solid #000}
.btn-small-black-border-light { font-size: 10px; letter-spacing: 3px; padding: 6px 25px; border: 1px solid #000; color: #000; }
.btn-small-black-border-light:hover { background-color: #000; color: #fff}
.btn-light-black{ border: 2px solid #000; color: #000; background-color: transparent}
.btn-light-black:hover {border: 2px solid #000; background-color: #000; color: #fff}

.button-desc { font-size:30px !important; line-height: 35px; font-family: 'Open Sans', sans-serif; font-weight: 600}
.button-desc span { display: block; font-size: 18px; font-weight: 400 }

.button-3d { border-bottom:2px solid rgba(0,0,0,0.2) !important;}

/* reveal button */
.button-reveal { overflow:hidden; position: relative; transition: all 200ms linear 0s; border: 2px solid #000; font-size:16px;}
.button-reveal i { position:absolute; left:-25px; top: 30%; color: #000; font-size: 20px;}
.button-reveal span {padding: 0 45px; display: block; line-height:54px}
.button-reveal:hover span { padding: 0 30px 0 60px; transition: all 200ms linear 0s; color: #000 }
.button-reveal:hover i { left:25px}
.btn.btn-large.button-reveal { padding: 0}

.button-reveal-black { background-color: #000; color: #fff}
.button-reveal-black span { color: #fff}
.button-reveal-black i { color: #fff}
.button-reveal-black:hover span { color: #fff}


/* ===================================
    Pages
====================================== */


/* ===================================
    Onepage demo
====================================== */


/* agency */

.slider-title-big2 { display: inline-block; font-size: 34px; font-weight: 300; letter-spacing: 8px; margin-bottom: 17px; }
.slider-title-big2 span { display: table; font-weight: 600; line-height: 61px; text-transform: none; }

.reasons { padding: 8.6% 25.6% 25.6%; }
.reasons p { font-size: 12px; line-height: 20px; margin: 30px 0; text-transform: none; }

.post-date { color: #878787; font-family: "Oswald",sans-serif; font-size: 9px; letter-spacing: 1px; margin-right: 6%; text-transform: uppercase; }
.about-text { margin-left: 40px; top:-7px;}


/* ===================================
    Multipage demo
====================================== */



/* corporate */
.corporate-slider h1 { font-size:50px; text-transform: inherit; line-height: 55px;}
.highlight-link-text {padding:0 25px; display:inline-block; line-height:30px !important;}
.highlight-link { padding:5px 13px; font-size:10px; font-weight:600; letter-spacing:2px; background: #e75e50 }
.highlight-link:hover { background:#000}
.highlight-link i {position:relative; top:2px; margin:0 0 0 5px}
.corporate-about-img {min-height:600px}
.corporate-about-text { min-height:300px; padding:70px 30px}
.corporate-standards .nav-tabs li a { padding:0 70px !important; display: inline-block !important; min-height: 65px}
.corporate-standards-img {min-height:600px}
.corporate-standards-text {min-height:600px; padding:5% 11%}
.corporate-standards-title { left: 0; position: absolute; right: 0; text-align: center; top: 68%; z-index:5 }
.corporate-standards-img i { color:#fe6e39 !important}
.corporate-standards-text .img-border-small-fix {z-index:-1}
.sub-title {  border-bottom: 1px solid #e75e50; display: inline-block; font-weight: 500; margin-top: 10px; text-transform: uppercase; }




/* onepage agency option 2 */


.bottom-arrow-pagination .owl-pagination {display: none;}
.bottom-arrow-pagination .owl-controls .owl-prev {display: block;}
.bottom-arrow-pagination .owl-controls .owl-next {display: block;}
.bottom-arrow-pagination .owl-buttons { bottom: 56px; position: absolute; width: 100%;}
.bottom-arrow-pagination .owl-prev, .bottom-arrow-pagination .owl-next {position: inherit; top: inherit; float: left; margin: 0; width: 56px; height: 56px; background-color: #2a2a2a; padding-top: 16px; text-align: center;}
.bottom-arrow-pagination .owl-buttons .owl-prev {left:  50%; margin-left: -56px;}
.bottom-arrow-pagination .owl-buttons .owl-next {right: 50%; margin-right: -56px;}
.bottom-arrow-pagination .owl-buttons .owl-prev::before, .bottom-arrow-pagination .owl-buttons .owl-next::before {position: inherit; background-color: inherit; box-shadow:none;}
.bottom-arrow-pagination .owl-buttons .owl-prev .fa, .bottom-arrow-pagination .owl-buttons .owl-next .fa {color: #fff; vertical-align: middle; display:table; margin: 0 auto; top: 0;}
.bottom-arrow-pagination .owl-buttons .owl-prev:hover, .bottom-arrow-pagination .owl-buttons .owl-next:hover {background-color: #ffffff;}
.bottom-arrow-pagination .owl-buttons .owl-prev:hover .fa, .bottom-arrow-pagination .owl-buttons .owl-next:hover .fa {color: #2a2a2a}




@media screen and (-webkit-min-device-pixel-ratio:0) {
  #safari { display: block; }
  nav * { transition-timing-function: none; -moz-transition-timing-function: none; -webkit-transition-timing-function: none; -o-transition-timing-function: none; transition-duration: 0s; -moz-transition-duration: 0s; -webkit-transition-duration: 0s; -o-transition-duration: 0s; }
}

/* ===================================
    Modern Design - Nakai IT
====================================== */

/* CSS Variables */
:root {
    --primary-dark: #0a192f;
    --primary-bg: #112240;
    --accent-cyan: #00d4ff;
    --accent-purple: #7b2cbf;
    --text-heading: #e6f1ff;
    --text-body: #8892b0;
    --gradient-it-start: #667eea;
    --gradient-it-end: #764ba2;
    --gradient-ec-start: #00d4ff;
    --gradient-ec-end: #0099cc;
    --gradient-dc-start: #f093fb;
    --gradient-dc-end: #f5576c;
}

/* Modern Font Family */
body.modern-theme {
    font-family: 'Inter', 'Noto Sans JP', -apple-system, BlinkMacSystemFont, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Full Screen Hero */
.full-screen {
    min-height: 100vh;
    height: 100vh;
}

.position-relative {
    position: relative;
}

/* ===================================
    Hero Section (CSS-only, no Owl Carousel)
====================================== */
#slider {
    width: 100%;
    height: 100vh;
    height: 100dvh;
    position: relative;
    overflow: hidden;
}

.hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('../images/hero-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 0;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(10, 25, 47, 0.9), rgba(17, 34, 64, 0.85));
    z-index: 1;
}

.hero-overlay::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image:
        linear-gradient(rgba(0, 212, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 212, 255, 0.03) 1px, transparent 1px);
    background-size: 50px 50px;
    z-index: 0;
}

.hero-content {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.hero-text {
    width: 100%;
}

.hero-text-inner {
    padding: 0 15px;
}

/* Legacy support (kept for compatibility) */
.opacity-full {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.slider-typography {
    position: relative;
    z-index: 2;
    display: table;
    height: 100%;
    width: 100%;
}

.slider-text-middle-main {
    display: table;
    height: 100%;
    width: 100%;
}

.slider-text-middle {
    display: table-cell;
    vertical-align: middle;
}

.slider-text-middle6 {
    padding: 0 15px;
}

/* Smooth Scroll */
html {
    scroll-behavior: smooth;
}

/* Inner Link Navigation */
.inner-link {
    cursor: pointer;
}

/* Service Section Enhancements */
.reasons {
    position: relative;
    overflow: hidden;
}

.reasons::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.cx-service-1:hover .reasons::before,
.cx-service-2:hover .reasons::before,
.cx-service-3:hover .reasons::before {
    opacity: 1;
}

/* WOW.js Animation Enhancements */
.wow {
    visibility: hidden;
}

.animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.fadeInUp {
    animation-name: fadeInUp;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 40px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

.fadeIn {
    animation-name: fadeIn;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Glow Effects */
.glow-text {
    text-shadow: 0 0 20px rgba(0, 212, 255, 0.5);
}

.glow-box {
    box-shadow: 0 0 30px rgba(0, 212, 255, 0.2);
}

/* Button Hover Effects */
.btn-modern {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));
    border: none;
    padding: 12px 30px;
    color: #fff;
    font-weight: 600;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.btn-modern::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: 0.5s;
}

.btn-modern:hover::before {
    left: 100%;
}

.btn-modern:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 212, 255, 0.3);
}

/* Card Hover Effect */
.card-hover {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-hover:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

/* Gradient Text */
.gradient-text {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===================================
    Nakai IT - Modern Theme Styles
====================================== */

/* Base Styles */
body {
    color: var(--text-body);
    font-family: 'Inter', 'Noto Sans JP', sans-serif;
    background-color: var(--primary-bg);
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: 'Inter', 'Noto Sans JP', sans-serif;
    color: var(--text-heading);
}

a {
    color: var(--accent-cyan);
}

a:hover, a:focus {
    text-decoration: none;
    color: #fff;
    outline: 0;
}

/* Navigation */
.navbar-fixed-top, .navbar-fixed-bottom {
    z-index: 80;
}

nav.navbar {
    background: rgba(10, 25, 47, 0.9) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(0, 212, 255, 0.1) !important;
}

nav.navbar.shrink-nav {
    background: rgba(10, 25, 47, 0.95) !important;
}

nav.navbar .container {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    height: 80px;
}

.shrink-nav .container {
    height: 60px;
}

nav.navbar .row {
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0;
}

.accordion-menu {
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
}

.navbar-nav {
    display: flex;
    align-items: center;
    margin: 0 !important;
}

.navbar-nav > li {
    margin: 0 15px;
}

.navbar-nav > li > a {
    color: var(--text-body) !important;
    font-weight: 500;
    letter-spacing: 2px;
    position: relative;
    transition: color 0.3s ease;
    padding: 10px 0 !important;
    line-height: 1.5 !important;
}

.navbar-nav > li > a:hover {
    color: var(--accent-cyan) !important;
}

.navbar-nav > li > a::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 50%;
    width: 0;
    height: 2px;
    background: var(--accent-cyan);
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.navbar-nav > li > a:hover::after,
.navbar-nav > li > a.active::after {
    width: 100%;
}

.navbar-nav > li > a.active {
    color: var(--accent-cyan) !important;
}

/* Logo */
.logo-modern {
    display: flex !important;
    align-items: center;
    text-decoration: none !important;
    line-height: 80px !important;
    height: 80px;
}

.shrink-nav .logo-modern {
    line-height: 60px !important;
    height: 60px;
}

.logo-text-main {
    font-family: 'Orbitron', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--text-heading);
    letter-spacing: 3px;
    transition: all 0.3s ease;
}

.logo-text-accent {
    font-family: 'Orbitron', sans-serif;
    font-size: 22px;
    font-weight: 900;
    color: var(--accent-cyan);
    letter-spacing: 1px;
    margin-left: 4px;
    text-shadow: 0 0 10px rgba(0, 212, 255, 0.5);
    transition: all 0.3s ease;
}

.logo-modern:hover .logo-text-main {
    color: #fff;
}

.logo-modern:hover .logo-text-accent {
    text-shadow: 0 0 20px rgba(0, 212, 255, 0.8);
}

/* Hero Section — overlay and grid handled by .hero-overlay in hero section above */

h1.slider-title-big6,
.slider-title-big6 {
    color: var(--text-heading) !important;
    text-shadow: 0 0 30px rgba(0, 212, 255, 0.3);
    line-height: 1.1;
    margin: 0;
    padding: 0;
}

.highlight-link-text {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple)) !important;
}

/* Service Boxes */
#services > .container-fluid > .row {
    display: flex;
    flex-wrap: wrap;
}

#services .col-md-4 {
    display: flex;
}

#services .reasons {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.cx-service-1 {
    background: linear-gradient(135deg, var(--gradient-it-start), var(--gradient-it-end));
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.cx-service-2 {
    background: linear-gradient(135deg, var(--gradient-ec-start), var(--gradient-ec-end));
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.cx-service-3 {
    background: linear-gradient(135deg, var(--gradient-dc-start), var(--gradient-dc-end));
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.cx-service-1:hover,
.cx-service-2:hover,
.cx-service-3:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

.service-icon {
    font-size: 6em;
    color: #fff;
    padding-bottom: 40px;
    text-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
}

/* ボタンがある場合のアイコン余白調整 */
.service-icon + .btn-service-detail {
    margin-top: -20px;
    margin-bottom: 20px;
}

/* SERVICE背景を3つとも同じ大きさに */
.cx-service-1,
.cx-service-2,
.cx-service-3 {
    min-height: 350px;
}

.cx-service-1 .reasons,
.cx-service-2 .reasons,
.cx-service-3 .reasons {
    min-height: 350px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* Team Section */
.about-text p {
    color: var(--text-body) !important;
}

.center-col {
    float: none !important;
    margin: 0 auto;
}

.case-study-details.bg-gray {
    padding: 60px 20px !important;
}


/* Footer */
footer {
    background: var(--primary-dark) !important;
    position: relative;
}

footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--accent-cyan), var(--accent-purple), var(--accent-cyan));
}

footer h5 {
    color: var(--text-heading) !important;
}

.footer-bottom {
    background: rgba(0, 0, 0, 0.3) !important;
}

.footer-bottom a,
.address-text a {
    color: var(--text-body);
}

.footer-bottom a:hover,
.address-text a:hover {
    color: var(--accent-cyan);
}

.footer-bottom .footer-social a i {
    color: var(--text-body);
}

.footer-bottom .footer-social a:hover i {
    color: var(--accent-cyan);
}

.address-icon {
    float: left;
    width: 15%;
    margin-left: 1px;
}

.single-address-line {
    overflow: hidden;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: 14px 0;
}

.address-text {
    float: left;
    width: 80%;
}

.address-icon i {
    color: var(--accent-cyan);
    font-size: 14px;
    line-height: 21px;
}

.copyright {
    color: var(--text-body) !important;
}

/* Scroll to Top */
.scrollToTop {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple)) !important;
    border-radius: 4px;
}

.scrollToTop:hover {
    opacity: 0.8 !important;
}

/* Smooth Scroll */
html {
    scroll-behavior: smooth;
}

/* ===================================
   Custom Fixes - 2026/01/19
====================================== */

/* Footer Contact Center */
.footer-contact-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.footer-contact-center .widget-content {
    display: inline-block;
}

.contact-center-line {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-top: none;
}

.contact-center-line .address-icon {
    float: none;
    width: auto;
    margin-right: 10px;
    margin-left: 0;
}

.contact-center-line .address-text {
    float: none;
    width: auto;
}

/* MEMBER年式を左揃え、中央配置 */
.about-text p.width-100 {
    text-align: left !important;
    display: inline-block;
    margin-bottom: 0 !important;
    width: auto !important;
    max-width: 500px;
}

/* ===================================
   Swiper - MEMBER Section
====================================== */
.member-swiper {
    width: 100%;
    position: relative;
}

.member-swiper .swiper-slide {
    width: 100%;
}

.member-swiper .swiper-button-prev,
.member-swiper .swiper-button-next {
    color: var(--accent-cyan);
    width: 44px;
    height: 44px;
}

.member-swiper .swiper-button-prev:after,
.member-swiper .swiper-button-next:after {
    font-size: 24px;
}

.member-swiper .swiper-button-prev {
    left: 10px;
}

.member-swiper .swiper-button-next {
    right: 10px;
}

.member-swiper .swiper-pagination {
    position: relative;
    margin-top: 20px;
}

.member-swiper .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: var(--text-body);
    opacity: 0.5;
    transition: all 0.3s ease;
}

.member-swiper .swiper-pagination-bullet-active {
    background: var(--accent-cyan);
    opacity: 1;
    box-shadow: 0 0 10px rgba(0, 212, 255, 0.5);
}

/* 年式の等幅数字 */
.year-history {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}

/* スマホのみ改行（PCでは非表示） */
.mobile-br {
    display: none;
}

/* ===================================
   CTA Button Styles
====================================== */
.hero-cta-container {
    margin-top: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.btn-cta {
    display: inline-block;
    padding: 16px 40px;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-decoration: none !important;
    border-radius: 50px;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 4px 20px rgba(0, 212, 255, 0.3);
}

.btn-cta::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
    transition: 0.5s;
}

.btn-cta:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(0, 212, 255, 0.5);
}

.btn-cta:hover::before {
    left: 100%;
}

.btn-cta-footer {
    padding: 14px 35px;
    font-size: 13px;
}

.btn-cta-footer i {
    margin-right: 8px;
    color: #fff !important;
}

.footer-email-text {
    margin-top: 15px;
    font-size: 13px;
    color: var(--text-body) !important;
    letter-spacing: 1px;
}

/* ===================================
   IT Consultant Page Styles
====================================== */

/* Hero Section */
.consultant-hero {
    position: relative;
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 50%, #16213e 100%);
    padding-top: 80px;
}

.consultant-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 30% 50%, rgba(0, 212, 255, 0.1) 0%, transparent 50%),
                radial-gradient(circle at 70% 50%, rgba(123, 44, 191, 0.1) 0%, transparent 50%);
}

.consultant-hero-content {
    z-index: 2;
    padding: 60px 20px;
}

.consultant-hero-title {
    font-size: 48px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 20px;
    letter-spacing: 3px;
    text-transform: none;
}

.consultant-hero-subtitle {
    font-size: 18px;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 40px;
    line-height: 1.8;
}

/* Section Base */
.consultant-section {
    padding: 80px 0;
}

.consultant-section-title {
    font-size: 32px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
    letter-spacing: 2px;
    text-transform: none;
}

.consultant-section-desc {
    font-size: 16px;
    color: #666;
    margin-bottom: 50px;
    line-height: 1.8;
}

/* Feature Cards */
.consultant-features {
    margin-top: 30px;
}

.consultant-feature-card {
    background: #fff;
    padding: 40px 30px;
    border-radius: 10px;
    text-align: left;
    margin-bottom: 30px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.consultant-feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}

.consultant-feature-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 25px;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.consultant-feature-icon i {
    font-size: 32px;
    color: #fff;
    margin: 0;
}

.consultant-feature-card h3 {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
    text-transform: none;
}

.consultant-feature-card p {
    font-size: 16px;
    color: #666;
    line-height: 1.8;
    margin: 0;
}

/* Pricing Cards */
.pricing-cards {
    margin-top: 30px;
}

.pricing-card {
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    margin-bottom: 30px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    position: relative;
}

.pricing-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
}

.pricing-card-popular {
    border: 2px solid var(--accent-cyan);
}

.pricing-popular-badge {
    position: absolute;
    top: 15px;
    right: -35px;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 5px 40px;
    transform: rotate(45deg);
    z-index: 10;
}

.pricing-card-header {
    padding: 30px;
    text-align: center;
    position: relative;
}

.pricing-ume {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
}

.pricing-take {
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
}

.pricing-matsu {
    background: linear-gradient(135deg, #fff3e0 0%, #ffe0b2 100%);
}

.pricing-badge {
    display: inline-block;
    font-size: 24px;
    font-weight: 700;
    color: #333;
    margin-bottom: 10px;
}

.pricing-plan-name {
    font-size: 16px;
    font-weight: 600;
    color: #666;
    margin: 0;
    text-transform: none;
}

.pricing-card-body {
    padding: 30px;
    text-align: center;
}

.pricing-price {
    margin-bottom: 25px;
}

.pricing-amount {
    font-size: 48px;
    font-weight: 700;
    color: #333;
    font-variant-numeric: tabular-nums;
}

.pricing-unit {
    font-size: 16px;
    color: #666;
}

.pricing-features {
    list-style: none;
    padding: 0;
    margin: 0 0 25px 0;
    text-align: left;
}

.pricing-features li {
    padding: 10px 0;
    font-size: 16px;
    color: #555;
    border-bottom: 1px solid #eee;
}

.pricing-features li:last-child {
    border-bottom: none;
}

.pricing-features li i {
    color: var(--accent-cyan);
    margin-right: 10px;
}

.pricing-note {
    font-size: 15px;
    color: #888;
    margin: 0;
}

.pricing-condition {
    margin-top: 40px;
}

.pricing-condition p {
    font-size: 14px;
    color: #666;
    background: #fff;
    padding: 20px 30px;
    border-radius: 10px;
    display: inline-block;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05);
}

.pricing-condition i {
    color: var(--accent-cyan);
    margin-right: 10px;
}

/* Flow Steps */
.flow-steps {
    position: relative;
    padding-left: 30px;
}

.flow-steps::before {
    content: '';
    position: absolute;
    left: 25px;
    top: 30px;
    bottom: 30px;
    width: 2px;
    background: linear-gradient(180deg, var(--accent-cyan), var(--accent-purple));
}

.flow-step {
    display: flex;
    align-items: flex-start;
    margin-bottom: 40px;
    position: relative;
}

.flow-step:last-child {
    margin-bottom: 0;
}

.flow-step-number {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
    z-index: 2;
}

.flow-step-content {
    background: #fff;
    padding: 25px 30px;
    border-radius: 10px;
    margin-left: 25px;
    flex-grow: 1;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
}

.flow-step-content h4 {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
    text-transform: none;
}

.flow-step-content p {
    font-size: 16px;
    color: #666;
    line-height: 1.8;
    margin: 0;
}

/* Notes Section */
.notes-box {
    background: #fff;
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.08);
    border-left: 4px solid var(--accent-cyan);
}

.notes-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.notes-list li {
    position: relative;
    padding: 12px 0 12px 25px;
    font-size: 14px;
    color: #555;
    line-height: 1.7;
    border-bottom: 1px solid #eee;
}

.notes-list li:last-child {
    border-bottom: none;
}

.notes-list li::before {
    content: '\f0da';
    font-family: FontAwesome;
    position: absolute;
    left: 0;
    color: var(--accent-cyan);
}

/* ====================================
   Consultant Page - Soft Design Theme
   ==================================== */

/* Consultant Page Body */
.consultant-page {
    background: #fff;
    font-family: 'BIZ UDPGothic', 'Noto Sans JP', sans-serif;
    font-weight: 400;
    letter-spacing: 0.03em;
    line-height: 2;
    font-size: 18px;
}

.consultant-page h1,
.consultant-page h2,
.consultant-page h3,
.consultant-page h4 {
    font-family: 'BIZ UDPGothic', 'Noto Sans JP', sans-serif;
    font-weight: 700;
}

.consultant-page p,
.consultant-page li {
    font-family: 'BIZ UDPGothic', 'Noto Sans JP', sans-serif;
    font-weight: 400;
    font-size: 17px;
    line-height: 2;
}

/* Navigation - Always beige for consultant page */
.consultant-page .navbar,
.consultant-page .navbar.shrink-nav,
.consultant-page .navbar.sticky-nav,
.consultant-page .navbar.sticky-nav.shrink-nav,
.consultant-page nav.navbar.shrink-nav {
    background: rgba(250, 248, 245, 0.98) !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08) !important;
}

.consultant-page .navbar .nav a,
.consultant-page .navbar .navbar-nav li a,
.consultant-page .navbar.shrink-nav .nav a,
.consultant-page .navbar.shrink-nav .navbar-nav li a {
    font-size: 13px !important;
    padding: 8px 12px !important;
    letter-spacing: 0 !important;
    color: #3d3d3d !important;
}

.consultant-page .navbar .navbar-nav li {
    margin: 0 !important;
}

.consultant-page .navbar .nav a:hover,
.consultant-page .navbar .nav a.active,
.consultant-page .navbar.shrink-nav .nav a:hover,
.consultant-page .navbar.shrink-nav .nav a.active {
    color: #5a9a8a !important;
    border-bottom-color: #5a9a8a !important;
}

.consultant-page .navbar .logo-text-main,
.consultant-page .navbar.shrink-nav .logo-text-main {
    color: #3d3d3d !important;
}

.consultant-page .navbar .logo-text-accent,
.consultant-page .navbar.shrink-nav .logo-text-accent {
    color: #5a9a8a !important;
}

/* Soft Background */
.bg-soft {
    background: linear-gradient(135deg, #faf8f5 0%, #f5f0eb 100%);
}

/* Soft Hero Section */
.consultant-hero-soft {
    background: linear-gradient(135deg, #faf8f5 0%, #f5f0eb 50%, #e8e0d5 100%);
    min-height: 450px;
}

.consultant-hero-soft .consultant-hero-title {
    color: #3d3d3d;
    font-size: 36px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.6;
}

.consultant-hero-soft .consultant-hero-subtitle {
    color: #666;
    font-size: 18px;
    margin-bottom: 40px;
}

/* Soft CTA Button */
.btn-cta-soft {
    display: inline-block;
    padding: 16px 40px;
    background: linear-gradient(135deg, #7ab8a8 0%, #5a9a8a 100%);
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
    border-radius: 30px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(122, 184, 168, 0.3);
}

.btn-cta-soft:hover {
    background: linear-gradient(135deg, #5a9a8a 0%, #4a8a7a 100%);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(122, 184, 168, 0.4);
}

/* Concerns Section */
.concerns-list {
    background: #fff;
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.06);
}

.concern-item {
    display: flex;
    align-items: flex-start;
    padding: 18px 0;
    border-bottom: 1px solid #f0ebe5;
}

.concern-item:last-child {
    border-bottom: none;
}

.concern-check {
    width: 28px;
    height: 28px;
    background: linear-gradient(135deg, #7ab8a8 0%, #5a9a8a 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-right: 18px;
    margin-top: 2px;
}

.concern-check i {
    color: #fff;
    font-size: 12px;
}

.concern-item p {
    font-size: 17px;
    color: #444;
    line-height: 1.8;
    margin: 0;
}

.concerns-cta {
    margin-top: 40px;
    font-size: 17px;
    font-weight: 500;
    color: #5a9a8a;
}

/* Soft Feature Cards */
.feature-card-soft {
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.06);
    border: none;
    min-height: 430px;
    display: flex;
    flex-direction: column;
}

.feature-card-soft:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

.feature-icon-soft {
    background: linear-gradient(135deg, #7ab8a8 0%, #5a9a8a 100%);
}

.feature-subtitle {
    font-size: 16px;
    font-weight: 500;
    color: #5a9a8a;
    margin-bottom: 15px;
    line-height: 1.6;
}

/* Profile Section */
.profile-card {
    background: #fff;
    border-radius: 20px;
    padding: 50px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.06);
}

.profile-header {
    display: flex;
    align-items: center;
    margin-bottom: 40px;
    padding-bottom: 30px;
    border-bottom: 1px solid #f0ebe5;
}

.profile-avatar {
    width: 100px;
    height: 100px;
    background: linear-gradient(135deg, #e8e0d5 0%, #d5cdc2 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 30px;
}

.profile-avatar i {
    font-size: 48px;
    color: #999;
}

.profile-info {
    flex: 1;
}

.profile-name {
    font-size: 28px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

.profile-title {
    font-size: 17px;
    color: #666;
    margin: 0;
}

.profile-stats {
    display: flex;
    justify-content: space-around;
    margin-bottom: 40px;
    padding: 30px 0;
    background: linear-gradient(135deg, #faf8f5 0%, #f5f0eb 100%);
    border-radius: 15px;
}

.stat-item {
    text-align: center;
}

.stat-number {
    font-size: 48px;
    font-weight: 700;
    color: #5a9a8a;
    line-height: 1;
}

.stat-unit {
    font-size: 18px;
    font-weight: 500;
    color: #5a9a8a;
    margin-left: 4px;
}

.stat-label {
    display: block;
    font-size: 15px;
    color: #666;
    margin-top: 10px;
}

.profile-career {
    margin-bottom: 30px;
}

.profile-career h4 {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 20px;
}

.profile-career ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.profile-career li {
    position: relative;
    padding: 10px 0 10px 25px;
    font-size: 16px;
    color: #555;
    line-height: 1.7;
}

.profile-career li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 18px;
    width: 8px;
    height: 8px;
    background: #7ab8a8;
    border-radius: 50%;
}

.profile-message {
    background: linear-gradient(135deg, #faf8f5 0%, #f5f0eb 100%);
    padding: 30px;
    border-radius: 15px;
    border-left: 4px solid #7ab8a8;
}

.profile-message p {
    font-size: 17px;
    color: #555;
    line-height: 2;
    margin: 0;
    font-style: italic;
}

/* Soft Pricing Cards */
.pricing-card-soft {
    border-radius: 20px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.06);
    border: 2px solid transparent;
}

.pricing-card-soft:hover {
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

.pricing-card-soft.pricing-card-popular {
    border-color: #7ab8a8;
}

.pricing-header-soft {
    background: linear-gradient(135deg, #faf8f5 0%, #f5f0eb 100%);
    padding: 30px;
}

.pricing-header-highlight {
    background: linear-gradient(135deg, #e8f4f0 0%, #d5ebe5 100%);
}

.pricing-plan-name-main {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

.pricing-plan-desc {
    font-size: 14px;
    color: #666;
    margin: 0;
}

.pricing-popular-badge-soft {
    position: absolute;
    top: 15px;
    right: 15px;
    background: linear-gradient(135deg, #7ab8a8 0%, #5a9a8a 100%);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 16px;
    border-radius: 20px;
    z-index: 10;
}

.pricing-card-soft .pricing-features li i {
    color: #5a9a8a;
}

.pricing-notes {
    background: #fff;
    padding: 25px 35px;
    border-radius: 15px;
    margin-top: 30px;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05);
}

.pricing-notes ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px 40px;
}

.pricing-notes li {
    font-size: 13px;
    color: #666;
    position: relative;
    padding-left: 18px;
}

.pricing-notes li::before {
    content: '•';
    position: absolute;
    left: 0;
    color: #7ab8a8;
    font-weight: bold;
}

/* Soft Flow Steps */
.flow-steps-soft::before {
    background: linear-gradient(180deg, #7ab8a8 0%, #5a9a8a 100%);
}

.flow-step-number-soft {
    background: linear-gradient(135deg, #7ab8a8 0%, #5a9a8a 100%);
}

.flow-step-content-soft {
    border-radius: 15px;
}

/* FAQ Section */
.faq-list {
    max-width: 800px;
    margin: 0 auto;
}

.faq-item {
    background: #fff;
    border-radius: 15px;
    margin-bottom: 15px;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.faq-question {
    display: flex;
    align-items: center;
    padding: 20px 25px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.faq-question:hover {
    background: #faf8f5;
}

.faq-q,
.faq-a {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
    margin-right: 15px;
}

.faq-q {
    background: linear-gradient(135deg, #7ab8a8 0%, #5a9a8a 100%);
    color: #fff;
}

.faq-a {
    background: #f5f0eb;
    color: #5a9a8a;
}

.faq-question p {
    flex: 1;
    font-size: 17px;
    font-weight: 500;
    color: #333;
    margin: 0;
    line-height: 1.6;
}

.faq-toggle {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
    transition: all 0.3s ease;
}

.faq-item.open .faq-toggle i::before {
    content: '\f068';
}

.faq-answer {
    display: none;
    padding: 25px;
}

.faq-answer p {
    font-size: 16px;
    color: #555;
    line-height: 1.9;
    margin: 0;
    flex: 1;
}

.faq-item.open .faq-answer {
    display: flex;
    align-items: flex-start;
}

/* Contact Section Soft */
.contact-section-soft {
    background: linear-gradient(135deg, #7ab8a8 0%, #5a9a8a 100%);
    padding: 80px 0;
}

.contact-section-soft .consultant-section-title {
    color: #fff;
}

.contact-desc {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.8;
    margin-bottom: 40px;
}

.btn-cta-contact {
    background: #fff;
    color: #5a9a8a;
    padding: 18px 50px;
    font-size: 18px;
    font-weight: 600;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.btn-cta-contact:hover {
    background: #fff;
    color: #4a8a7a;
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
}

.btn-cta-contact i {
    margin-right: 10px;
}

.contact-note {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.8);
    margin-top: 25px;
}

/* ====================================
   Index Page - Soft Design Theme
   ==================================== */

.index-page-soft {
    font-family: 'BIZ UDPGothic', 'Noto Sans JP', sans-serif;
    font-weight: 400;
    letter-spacing: 0.03em;
    line-height: 1.9;
    background: #faf8f5;
    font-size: 18px;
}

.index-page-soft h1,
.index-page-soft h2,
.index-page-soft h3,
.index-page-soft h4,
.index-page-soft h5 {
    font-family: 'BIZ UDPGothic', 'Noto Sans JP', sans-serif;
    font-weight: 700;
}

.index-page-soft p {
    font-size: 15px;
    line-height: 2;
}

.index-page-soft .reasons p {
    font-size: 17px;
    line-height: 1.9;
}

.index-page-soft .year-history {
    font-size: 15px !important;
    line-height: 2.4 !important;
}

.index-page-soft .navbar .nav a,
.index-page-soft .navbar .navbar-nav li a {
    font-size: 13px !important;
    padding: 8px 12px !important;
    letter-spacing: 0 !important;
}

.index-page-soft .navbar .navbar-nav li {
    margin: 0 !important;
}

/* Hero Section - keep original background image */
.index-page-soft .slider-title-big6 {
    font-weight: 600 !important;
}

.index-page-soft .highlight-link-text {
    font-weight: 500 !important;
}

.index-page-soft .btn-cta {
    background: linear-gradient(135deg, #7ab8a8 0%, #5a9a8a 100%);
    border: none;
    box-shadow: 0 4px 15px rgba(122, 184, 168, 0.3);
}

.index-page-soft .btn-cta:hover {
    background: linear-gradient(135deg, #5a9a8a 0%, #4a8a7a 100%);
    box-shadow: 0 6px 20px rgba(122, 184, 168, 0.4);
}

/* Services Section - keep original colors */
.index-page-soft .slider-title-big2 {
    font-weight: 500 !important;
}

/* Member Section Soft */
.index-page-soft #our-team {
    background: linear-gradient(135deg, #faf8f5 0%, #f5f0eb 100%);
}

.index-page-soft .case-study-details {
    background: linear-gradient(135deg, #faf8f5 0%, #f5f0eb 100%) !important;
}

.index-page-soft .member-swiper {
    background: linear-gradient(135deg, #faf8f5 0%, #f5f0eb 100%);
}

.index-page-soft .title-large {
    color: #3d3d3d !important;
    font-weight: 600 !important;
}

.index-page-soft .title-small {
    color: #444 !important;
}

.index-page-soft .year-history {
    color: #555 !important;
}

.index-page-soft .swiper-button-prev,
.index-page-soft .swiper-button-next {
    color: #7ab8a8 !important;
}

.index-page-soft .swiper-pagination-bullet-active {
    background: #7ab8a8 !important;
}

/* Footer Soft */
.index-page-soft footer#contact .footer-middle {
    background: linear-gradient(135deg, #7ab8a8 0%, #5a9a8a 100%);
}

.index-page-soft footer#contact h5 {
    color: #fff;
}

.index-page-soft .btn-cta-footer {
    background: #fff !important;
    color: #5a9a8a !important;
    border: none !important;
}

.index-page-soft .btn-cta-footer i {
    color: #5a9a8a !important;
}

.index-page-soft .btn-cta-footer:hover {
    background: #fff !important;
    color: #4a8a7a !important;
    transform: translateY(-2px);
}

.index-page-soft .btn-cta-footer:hover i {
    color: #4a8a7a !important;
}

.index-page-soft .footer-email-text {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Navigation Soft - Always beige */
.index-page-soft .navbar,
.index-page-soft .navbar.shrink-nav,
.index-page-soft .navbar.sticky-nav,
.index-page-soft .navbar.sticky-nav.shrink-nav,
.index-page-soft nav.navbar.shrink-nav {
    background: rgba(250, 248, 245, 0.98) !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08) !important;
}

.index-page-soft .navbar .nav a,
.index-page-soft .navbar.shrink-nav .nav a,
.index-page-soft .navbar .navbar-nav li a,
.index-page-soft .navbar.shrink-nav .navbar-nav li a {
    color: #3d3d3d !important;
}

.index-page-soft .navbar .nav a:hover,
.index-page-soft .navbar .nav a.active,
.index-page-soft .navbar.shrink-nav .nav a:hover,
.index-page-soft .navbar.shrink-nav .nav a.active {
    color: #5a9a8a !important;
    border-bottom-color: #5a9a8a !important;
}

.index-page-soft .navbar .logo-text-main,
.index-page-soft .navbar.shrink-nav .logo-text-main {
    color: #3d3d3d !important;
}

.index-page-soft .navbar .logo-text-accent,
.index-page-soft .navbar.shrink-nav .logo-text-accent {
    color: #5a9a8a !important;
}

/* ===================================
    Contact Form - Soft Theme
====================================== */
.contact-form {
    max-width: 600px;
    margin: 0 auto;
    padding: 40px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.contact-form .form-group {
    margin-bottom: 24px;
}

.contact-form label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #3d3d3d;
    font-size: 15px;
}

.contact-form label .required {
    color: #e07070;
    margin-left: 4px;
    font-size: 12px;
}

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form textarea,
.contact-form select {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e8e4e0;
    border-radius: 8px;
    font-size: 16px;
    font-family: 'BIZ UDPGothic', sans-serif;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    background: #faf8f5;
    text-transform: none;
}

.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus {
    outline: none;
    border-color: #7ab8a8;
    box-shadow: 0 0 0 3px rgba(122, 184, 168, 0.2);
    background: #fff;
}

.contact-form textarea {
    min-height: 150px;
    resize: vertical;
}

.contact-form select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 40px;
    cursor: pointer;
}

.contact-form .btn-submit {
    display: inline-block;
    width: 100%;
    padding: 16px 32px;
    background: #7ab8a8;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 17px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.2s ease;
    font-family: 'BIZ UDPGothic', sans-serif;
}

.contact-form .btn-submit:hover {
    background: #5a9a8a;
    transform: translateY(-2px);
}

.contact-form .btn-submit:active {
    transform: translateY(0);
}

.contact-form .form-note {
    margin-top: 20px;
    padding: 16px;
    background: #f5f0eb;
    border-radius: 8px;
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

.contact-form .privacy-note {
    margin-top: 16px;
    font-size: 13px;
    color: #888;
    text-align: center;
}

/* Index page contact form adjustments */
.index-page-soft .contact-form {
    background: rgba(255, 255, 255, 0.95);
}

/* Dark footer form text color fix */
.footer-middle .contact-form label {
    color: #3d3d3d;
}

/* ===================================
    Hero Secondary CTA Button
====================================== */
.btn-cta-secondary {
    display: inline-block;
    padding: 14px 32px;
    background: transparent;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    text-decoration: none;
    transition: all 0.3s ease;
    font-family: 'BIZ UDPGothic', sans-serif;
}

.btn-cta-secondary:hover {
    background: #fff;
    color: #333;
    text-decoration: none;
}

/* ===================================
    Service Card Detail Button
====================================== */
.btn-service-detail {
    display: inline-block;
    margin-top: 0;
    padding: 10px 24px;
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 25px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-service-detail:hover {
    background: rgba(255, 255, 255, 0.3);
    color: #fff;
    text-decoration: none;
    border-color: #fff;
}

/* ===================================
    Privacy Policy Page
====================================== */
.privacy-page {
    background: #faf8f5;
}

.privacy-hero {
    background: linear-gradient(135deg, #f5f0e8 0%, #ece4d9 100%);
    padding: 140px 0 60px;
    text-align: center;
}

.privacy-title {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #2c2c2c;
    margin-bottom: 15px;
}

.privacy-subtitle {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    color: #666;
    margin: 0;
}

.privacy-content {
    padding: 60px 0 80px;
    background: #faf8f5;
}

.privacy-intro {
    background: #fff;
    padding: 30px;
    border-radius: 8px;
    margin-bottom: 40px;
    border: 1px solid #e8e4dc;
}

.privacy-intro p {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    line-height: 1.9;
    color: #444;
    margin: 0;
}

.privacy-section {
    margin-bottom: 35px;
}

.privacy-section h2 {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #2c2c2c;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.privacy-section .section-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: #6b8e7b;
    color: #fff;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 600;
    flex-shrink: 0;
}

.privacy-section p {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    line-height: 1.9;
    color: #444;
    margin-bottom: 15px;
}

.privacy-section ul {
    padding-left: 20px;
    margin-bottom: 0;
}

.privacy-section ul li {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    line-height: 1.9;
    color: #444;
    position: relative;
    padding-left: 15px;
    margin-bottom: 8px;
}

.privacy-section ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 10px;
    width: 6px;
    height: 6px;
    background: #6b8e7b;
    border-radius: 50%;
}

.privacy-section .contact-info {
    background: #f5f0e8;
    padding: 20px 25px;
    border-radius: 8px;
    margin-top: 15px;
}

.privacy-section .contact-info p {
    margin-bottom: 5px;
}

.privacy-section .contact-info p:last-child {
    margin-bottom: 0;
}

.privacy-section .contact-info a {
    color: #6b8e7b;
    text-decoration: none;
}

.privacy-section .contact-info a:hover {
    text-decoration: underline;
}

.privacy-footer {
    margin-top: 50px;
    padding-top: 30px;
    border-top: 1px solid #e8e4dc;
    text-align: right;
}

.privacy-footer .established-date {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 14px;
    color: #666;
    margin-bottom: 5px;
}

.privacy-footer .company-name {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #2c2c2c;
    margin: 0;
}

/* Footer Privacy Link */
.footer-link {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 13px;
    color: #999;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-link:hover {
    color: #fff;
    text-decoration: none;
}

/* Privacy Agreement Text for Forms */
.privacy-agreement {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 13px;
    color: #666;
    text-align: center;
    margin-top: 15px;
}

.privacy-agreement a {
    color: #6b8e7b;
    text-decoration: none;
}

.privacy-agreement a:hover {
    text-decoration: underline;
}

/* Member Blog Button */
.member-blog-wrap {
    margin-top: 20px;
}

.member-blog-wrap .btn-cta-soft {
    padding: 10px 28px;
    font-size: 14px;
    color: #fff;
}

.member-blog-wrap .btn-cta-soft i.fa {
    margin-right: 8px;
    color: #fff !important;
}

/* Hero Section (index.html) */
.hero-section {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
}

.hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('../images/hero-bg.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 1;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(34, 34, 34, 0.7);
    z-index: 2;
}

.hero-content {
    position: relative;
    z-index: 3;
    height: 100vh;
    min-height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-text {
    width: 100%;
}

.hero-text-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}