/* font-face */ @font-face{src:url("/assets/fonts/fontawesome-webfont.woff2?v=4.7.0") format('woff2'),url("/assets/fonts/fontawesome-webfont.woff?v=4.7.0") format('woff');font-family:'FontAwesome';font-weight:normal;font-style:normal} @font-face{src:url("/assets/fonts/ionicons.woff?v=2.0.0") format("woff");font-family:"Ionicons";font-weight:normal;font-style:normal} /* wp-core.css */ :root{--wp-block-synced-color:#7a00df;--wp-block-synced-color--rgb:122,0,223;--wp-bound-block-color:var(--wp-block-synced-color);--wp-editor-canvas-background:#ddd;--wp-admin-theme-color:#007cba;--wp-admin-theme-color--rgb:0,124,186;--wp-admin-theme-color-darker-10:#006ba1;--wp-admin-theme-color-darker-10--rgb:0,107,160.5;--wp-admin-theme-color-darker-20:#005a87;--wp-admin-theme-color-darker-20--rgb:0,90,135;--wp-admin-border-width-focus:2px} @media (min-resolution:192dpi){:root{--wp-admin-border-width-focus:1.5px}} :root .has-very-light-gray-background-color{background-color:#eee} :root .has-very-dark-gray-color{color:#313131} :root{--wp--preset--font-size--normal:16px;--wp--preset--font-size--huge:42px} .has-normal-font-size{font-size:var(--wp--preset--font-size--normal)} :root .has-text-align-center{text-align:center} :root .has-text-align-left{text-align:left} :root .has-text-align-right{text-align:right} .aligncenter{clear:both} .screen-reader-text{word-wrap:normal!important;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal!important} .screen-reader-text:focus{background-color:#ddd;clip-path:none;color:#444;display:block;font-size:1em;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000} border-color"]){border-style:solid} border-top-color"]){border-top-style:solid} border-right-color"]){border-right-style:solid} border-bottom-color"]){border-bottom-style:solid} border-left-color"]){border-left-style:solid} border-width"]){border-style:solid} border-top-width"]){border-top-style:solid} border-right-width"]){border-right-style:solid} border-bottom-width"]){border-bottom-style:solid} border-left-width"]){border-left-style:solid} html :where(img[class*=wp-image-]){height:auto;max-width:100%} :where(figure){margin:0 0 1em} h1:where(.wp-block-heading).has-background,h2:where(.wp-block-heading).has-background,h3:where(.wp-block-heading).has-background,h4:where(.wp-block-heading).has-background,h5:where(.wp-block-heading).has-background,h6:where(.wp-block-heading).has-background{padding:1.25em 2.375em} h1.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h1.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h2.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h2.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h3.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h3.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h4.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h4.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h5.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h5.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h6.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]){rotate:180deg} .wp-block-image>a,.wp-block-image>figure>a{display:inline-block} .wp-block-image img{box-sizing:border-box;height:auto;max-width:100%;vertical-align:bottom} .wp-block-image[style*=border-radius] img,.wp-block-image[style*=border-radius]>a{border-radius:inherit} .wp-block-image.aligncenter{text-align:center} .wp-block-image.alignwide>a{width:100%} .wp-block-image.alignwide img{height:auto;width:100%} .wp-block-image .aligncenter,.wp-block-image .alignleft,.wp-block-image.aligncenter,.wp-block-image.alignleft{display:table} .wp-block-image .aligncenter>figcaption,.wp-block-image .alignleft>figcaption,.wp-block-image.aligncenter>figcaption,.wp-block-image.alignleft>figcaption{caption-side:bottom;display:table-caption} .wp-block-image .alignleft{float:left;margin:.5em 1em .5em 0} .wp-block-image .aligncenter{margin-left:auto;margin-right:auto} .wp-block-image :where(figcaption){margin-bottom:1em;margin-top:.5em} .wp-block-image figure{margin:0} ol,ul{box-sizing:border-box} :root :where(.wp-block-list.has-background){padding:1.25em 2.375em} :root :where(p.has-background){padding:1.25em 2.375em} :where(p.has-text-color:not(.has-link-color)) a{color:inherit} p.has-text-align-left[style*="writing-mode:vertical-lr"],p.has-text-align-right[style*="writing-mode:vertical-rl"]{rotate:180deg} .wp-block-separator{border:none;border-top:2px solid} .wp-block-embed.alignleft{max-width:360px;width:100%} .wp-block-embed.alignleft .wp-block-embed__wrapper{min-width:280px} .wp-block-group.is-layout-flex .wp-block-embed{flex:1 1 0%;min-width:0} .wp-block-embed{overflow-wrap:break-word} .wp-block-embed :where(figcaption){margin-bottom:1em;margin-top:.5em} .wp-block-embed iframe{max-width:100%} .wp-block-embed__wrapper{position:relative} .wp-block-quote{box-sizing:border-box;overflow-wrap:break-word} .wp-block-quote>cite{display:block} :root{--wp--preset--aspect-ratio--square: 1;--wp--preset--aspect-ratio--4-3: 4/3;--wp--preset--aspect-ratio--3-4: 3/4;--wp--preset--aspect-ratio--3-2: 3/2;--wp--preset--aspect-ratio--2-3: 2/3;--wp--preset--aspect-ratio--16-9: 16/9;--wp--preset--aspect-ratio--9-16: 9/16;--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3;--wp--preset--color--white: #ffffff;--wp--preset--color--pale-pink: #f78da7;--wp--preset--color--vivid-red: #cf2e2e;--wp--preset--color--luminous-vivid-orange: #ff6900;--wp--preset--color--luminous-vivid-amber: #fcb900;--wp--preset--color--light-green-cyan: #7bdcb5;--wp--preset--color--vivid-green-cyan: #00d084;--wp--preset--color--pale-cyan-blue: #8ed1fc;--wp--preset--color--vivid-cyan-blue: #0693e3;--wp--preset--color--vivid-purple: #9b51e0;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgb(6,147,227) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgb(252,185,0) 0%,rgb(255,105,0) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgb(255,105,0) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small: 13px;--wp--preset--font-size--medium: 20px;--wp--preset--font-size--large: 36px;--wp--preset--font-size--x-large: 42px;--wp--preset--spacing--20: 0.44rem;--wp--preset--spacing--30: 0.67rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2.25rem;--wp--preset--spacing--70: 3.38rem;--wp--preset--spacing--80: 5.06rem;--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgb(255, 255, 255), 6px 6px rgb(0, 0, 0);--wp--preset--shadow--crisp: 6px 6px 0px rgb(0, 0, 0);} :where(body){ margin: 0; } :where(.is-layout-flex){gap: 0.5em;} body .is-layout-flex{display: flex;} .is-layout-flex{flex-wrap: wrap;align-items: center;} .is-layout-flex > :is(*, div){margin: 0;} body{padding-top: 0px;padding-right: 0px;padding-bottom: 0px;padding-left: 0px;} .has-black-color{color: var(--wp--preset--color--black) !important;} .has-white-color{color: var(--wp--preset--color--white) !important;} .has-vivid-red-color{color: var(--wp--preset--color--vivid-red) !important;} .has-luminous-vivid-orange-color{color: var(--wp--preset--color--luminous-vivid-orange) !important;} .has-luminous-vivid-amber-color{color: var(--wp--preset--color--luminous-vivid-amber) !important;} .has-vivid-cyan-blue-color{color: var(--wp--preset--color--vivid-cyan-blue) !important;} .has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;} .has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;} /* bootstrap3.css */ html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%} body{margin:0} article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block} audio,canvas,progress,video{display:inline-block;vertical-align:baseline} audio:not([controls]){display:none;height:0} [hidden],template{display:none} a{background-color:transparent} a:active,a:hover{outline:0} abbr[title]{border-bottom:1px dotted} b,strong{font-weight:700} dfn{font-style:italic} h1{margin:.67em 0;font-size:2em} mark{color:#000;background:#ff0} small{font-size:80%} sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline} sup{top:-.5em} sub{bottom:-.25em} img{border:0} svg:not(:root){overflow:hidden} figure{margin:1em 40px} hr{height:0;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box} pre{overflow:auto} code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em} button,input,optgroup,select,textarea{margin:0;font:inherit;color:inherit} button{overflow:visible} button,select{text-transform:none} button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer} button[disabled],html input[disabled]{cursor:default} button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0} input{line-height:normal} input[type=checkbox],input[type=radio]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0} input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto} input[type=search]{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield} input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none} fieldset{padding:.35em .625em .75em;margin:0 2px;border:1px solid silver} legend{padding:0;border:0} textarea{overflow:auto} optgroup{font-weight:700} table{border-spacing:0;border-collapse:collapse} td,th{padding:0} @media print{*,:before,:after{color:#000!important;text-shadow:none!important;background:transparent!important;-webkit-box-shadow:none!important;box-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}select{background:#fff!important}} *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} :before,:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} html{font-size:10px;-webkit-tap-highlight-color:rgba(0,0,0,0)} body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857143;color:#333;background-color:#fff} input,button,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit} a{color:#337ab7;text-decoration:none} a:hover,a:focus{color:#23527c;text-decoration:underline} a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px} figure{margin:0} img{vertical-align:middle} hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid #eee} h1,h2,h3,h4,h5,h6{font-family:inherit;font-weight:500;line-height:1.1;color:inherit} h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{font-weight:400;line-height:1;color:#777} h1,h2,h3{margin-top:20px;margin-bottom:10px} h1 small,h2 small,h3 small{font-size:65%} h4,h5,h6{margin-top:10px;margin-bottom:10px} h4 small,h5 small,h6 small{font-size:75%} h1{font-size:36px} h2{font-size:30px} h3{font-size:24px} h4{font-size:18px} h5{font-size:14px} h6{font-size:12px} p{margin:0 0 10px} .lead{margin-bottom:20px;font-size:16px;font-weight:300;line-height:1.4} @media (min-width:768px){.lead{font-size:21px}} small{font-size:85%} mark{padding:.2em;background-color:#fcf8e3} .text-center{text-align:center} ul,ol{margin-top:0;margin-bottom:10px} ul ul,ol ul,ul ol,ol ol{margin-bottom:0} dl{margin-top:0;margin-bottom:20px} dt,dd{line-height:1.42857143} dt{font-weight:700} dd{margin-left:0} abbr[title],abbr[data-original-title]{cursor:help;border-bottom:1px dotted #777} blockquote{padding:10px 20px;margin:0 0 20px;font-size:17.5px;border-left:5px solid #eee} blockquote p:last-child,blockquote ul:last-child,blockquote ol:last-child{margin-bottom:0} blockquote footer,blockquote small{display:block;font-size:80%;line-height:1.42857143;color:#777} blockquote footer:before,blockquote small:before{content:'\2014 \00A0'} address{margin-bottom:20px;font-style:normal;line-height:1.42857143} code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,"Courier New",monospace} code{padding:2px 4px;font-size:90%;color:#c7254e;background-color:#f9f2f4;border-radius:4px} kbd{padding:2px 4px;font-size:90%;color:#fff;background-color:#333;border-radius:3px;-webkit-box-shadow:inset 0 -1px 0 rgba(0,0,0,.25);box-shadow:inset 0 -1px 0 rgba(0,0,0,.25)} kbd kbd{padding:0;font-size:100%;font-weight:700;-webkit-box-shadow:none;box-shadow:none} pre{display:block;padding:9.5px;margin:0 0 10px;font-size:13px;line-height:1.42857143;color:#333;word-break:break-all;word-wrap:break-word;background-color:#f5f5f5;border:1px solid #ccc;border-radius:4px} pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0} .container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto} @media (min-width:768px){.container{width:750px}} @media (min-width:992px){.container{width:970px}} @media (min-width:1200px){.container{width:1170px}} .container-fluid{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto} .row{margin-right:-15px;margin-left:-15px} .col-md-2,.col-md-3,.col-xs-4,.col-sm-4,.col-md-4,.col-lg-4,.col-sm-5,.col-md-5,.col-lg-5,.col-xs-6,.col-sm-6,.col-md-6,.col-lg-6,.col-sm-7,.col-md-7,.col-lg-7,.col-sm-8,.col-md-8,.col-lg-8,.col-sm-9,.col-md-9,.col-sm-10,.col-md-10,.col-lg-10,.col-xs-12,.col-sm-12,.col-lg-12{position:relative;min-height:1px;padding-right:15px;padding-left:15px} .col-xs-4,.col-xs-6,.col-xs-12{float:left} .col-xs-12{width:100%} .col-xs-6{width:50%} .col-xs-4{width:33.33333333%} @media (min-width:768px){.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-12{float:left}.col-sm-12{width:100%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-pull-6{right:50%}.col-sm-pull-4{right:33.33333333%}.col-sm-push-8{left:66.66666667%}.col-sm-push-6{left:50%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-2{margin-left:16.66666667%}} @media (min-width:992px){.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10{float:left}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-pull-6{right:50%}.col-md-push-6{left:50%}.col-md-offset-3{margin-left:25%}.col-md-offset-1{margin-left:8.33333333%}} @media (min-width:1200px){.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-10,.col-lg-12{float:left}.col-lg-12{width:100%}.col-lg-10{width:83.33333333%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-push-2{left:16.66666667%}.col-lg-push-1{left:8.33333333%}.col-lg-offset-4{margin-left:33.33333333%}.col-lg-offset-2{margin-left:16.66666667%}.col-lg-offset-1{margin-left:8.33333333%}} table{background-color:transparent} caption{padding-top:8px;padding-bottom:8px;color:#777;text-align:left} th{text-align:left} table col[class*=col-]{position:static;display:table-column;float:none} table td[class*=col-],table th[class*=col-]{position:static;display:table-cell;float:none} fieldset{min-width:0;padding:0;margin:0;border:0} legend{display:block;width:100%;padding:0;margin-bottom:20px;font-size:21px;line-height:inherit;color:#333;border:0;border-bottom:1px solid #e5e5e5} label{display:inline-block;max-width:100%;margin-bottom:5px;font-weight:700} input[type=search]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} input[type=radio],input[type=checkbox]{margin:4px 0 0;margin-top:1px \9;line-height:normal} input[type=file]{display:block} input[type=range]{display:block;width:100%} select[multiple],select[size]{height:auto} input[type=file]:focus,input[type=radio]:focus,input[type=checkbox]:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px} output{display:block;padding-top:7px;font-size:14px;line-height:1.42857143;color:#555} input[type=search]{-webkit-appearance:none} @media screen and (-webkit-min-device-pixel-ratio:0){input[type=date],input[type=time],input[type=datetime-local],input[type=month]{line-height:34px}} input[type=radio][disabled],input[type=checkbox][disabled],fieldset[disabled] input[type=radio],fieldset[disabled] input[type=checkbox]{cursor:not-allowed} .open>a{outline:0} .pagination{display:inline-block;padding-left:0;margin:20px 0;border-radius:4px} .pagination>li{display:inline} .pagination>li>a,.pagination>li>span{position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.42857143;color:#337ab7;text-decoration:none;background-color:#fff;border:1px solid #ddd} .pagination>li:first-child>a,.pagination>li:first-child>span{margin-left:0;border-top-left-radius:4px;border-bottom-left-radius:4px} .pagination>li:last-child>a,.pagination>li:last-child>span{border-top-right-radius:4px;border-bottom-right-radius:4px} .pagination>li>a:hover,.pagination>li>span:hover,.pagination>li>a:focus,.pagination>li>span:focus{color:#23527c;background-color:#eee;border-color:#ddd} .pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover,.pagination>.active>span:hover,.pagination>.active>a:focus,.pagination>.active>span:focus{z-index:2;color:#fff;cursor:default;background-color:#337ab7;border-color:#337ab7} .media{margin-top:15px} .media:first-child{margin-top:0} .close{float:right;font-size:21px;font-weight:700;line-height:1;color:#000;text-shadow:0 1px 0 #fff;filter:alpha(opacity=20);opacity:.2} .close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer;filter:alpha(opacity=50);opacity:.5} button.close{-webkit-appearance:none;padding:0;cursor:pointer;background:0 0;border:0} .clearfix:before,.clearfix:after,.container:before,.container:after,.container-fluid:before,.container-fluid:after,.row:before,.row:after{display:table;content:" "} .clearfix:after,.container:after,.container-fluid:after,.row:after{clear:both} @-ms-viewport{width:device-width} .visible-xs,.visible-sm,.visible-lg{display:none!important} .visible-xs-block,.visible-md-block{display:none!important} @media (max-width:767px){.visible-xs{display:block!important}table.visible-xs{display:table}tr.visible-xs{display:table-row!important}th.visible-xs,td.visible-xs{display:table-cell!important}} @media (max-width:767px){.visible-xs-block{display:block!important}} @media (min-width:768px) and (max-width:991px){.visible-sm{display:block!important}table.visible-sm{display:table}tr.visible-sm{display:table-row!important}th.visible-sm,td.visible-sm{display:table-cell!important}} @media (min-width:992px) and (max-width:1199px){.visible-md-block{display:block!important}} @media (min-width:1200px){.visible-lg{display:block!important}table.visible-lg{display:table}tr.visible-lg{display:table-row!important}th.visible-lg,td.visible-lg{display:table-cell!important}} @media (max-width:767px){.hidden-xs{display:none!important}} @media (min-width:768px) and (max-width:991px){.hidden-sm{display:none!important}} @media (min-width:992px) and (max-width:1199px){.hidden-md{display:none!important}} @media (min-width:1200px){.hidden-lg{display:none!important}} /* font-awesome.min.css */ .fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale} .fa-times:before{content:"\f00d"} .fa-cloud-download:before{content:"\f0ed"} .fa-angle-right:before{content:"\f105"} .fa-facebook-official:before{content:"\f230"} .fa::before{font-family: "FontAwesome"} /* swiper.min.css */ :root{--swiper-theme-color:#007aff} :host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1} .swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;overflow:clip;list-style:none;padding:0;z-index:1;display:block} .swiper-vertical>.swiper-wrapper{flex-direction:column} .swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box} .swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)} .swiper-horizontal{touch-action:pan-y} .swiper-vertical{touch-action:pan-x} .swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block} .swiper-slide-invisible-blank{visibility:hidden} .swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto} .swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height} .swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden} .swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px} .swiper-3d .swiper-wrapper{transform-style:preserve-3d} .swiper-3d{perspective:1200px} .swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d} .swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none} .swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none} .swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start} .swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory} .swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory} .swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none} .swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none} .swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999} .swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always} .swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)} .swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)} .swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)} .swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)} .swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10} .swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)} .swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent} .swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear} .swiper-lazy-preloader-white{--swiper-preloader-color:#fff} .swiper-lazy-preloader-black{--swiper-preloader-color:#000} @keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}} /* ionicons.min.css */ /* pixxy.min.css */ html.js{font-size:15px;margin-top:0 !important} body{min-height:100vh;overflow-x:hidden;font-family:'Nunito Sans', sans-serif;font-weight:400;font-size:15px;color:#888888;position:relative;background:#ffffff} strong,b{font-weight:800} .::-moz-selection{background:#0073e6;color:#ffffff} ::selection{background:#0073e6;color:#ffffff} *{margin:0;padding:0;outline:0;-webkit-font-smoothing:antialiased} :focus{outline:0} a,a:hover,a:focus{color:#888;outline:0;-webkit-transition:all 300ms ease;transition:all 300ms ease;text-decoration:none} .no-scroll{overflow-y:hidden !important} .main-wrapper img{max-width:100%;height:auto} h1,h2,h3,h4,h5,h6{font-family:'Nunito Sans', sans-serif;font-weight:800;color:#222} .single-post h1,.single-post h2,.single-post h3,.single-post h4,.single-post h5,.single-post h6{font-family:'Nunito Sans', sans-serif;font-weight:800;color:#222;margin-bottom:20px;line-height:1.2} h1{font-size:44px} h2{font-size:36px} h3{font-size:27px} h4{font-size:20px} h5{font-size:18px} h6{font-size:14px} p{font-family:'Nunito Sans', sans-serif} @media (max-width: 767px){body{font-size:14px;line-height:1.2}h1{font-size:34px}h2{font-size:30px}h3{font-size:26px}h4{font-size:22px}h5{font-size:17px}h6{font-size:13px}} .single-content img{max-width:100%;height:auto;display:inline-block;border:none} .aligncenter,div.aligncenter{display:block;margin:5px auto 5px auto} .padding-both>.container{padding:45px 30px 20px !important} h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child{margin-top:0} abbr,acronym{border-bottom:none !important} @media (max-width: 767px){[class*="col-sm"]{margin-bottom:0}} .text-center{text-align:center} .row,.col-xs-12{min-height:0} .black{background-color:#000} .highlight{background-color:#000;color:#ffffff} iframe[name="advpp_manager"]{position:absolute;left:-9999px} [class*="overlay-dark"] ~ *,[class*="overlay-light"] ~ *{position:relative} [data-stellar-background-ratio]{background-attachment:fixed;background-size:cover;background-position:center center;position:relative} @media (max-width: 1024px){[data-stellar-background-ratio]{background-attachment:scroll;background-position-y:center !important}} .container,section,section>*{position:relative} .container{max-width:100%} blockquote{border:none;font-size:15px;padding:10px 15px} blockquote footer{font-size:85%} blockquote cite{line-height:1.42857;color:#777;font-style:normal;display:block;font-size:14px;margin-top:15px} blockquote cite:before{content:'- ';margin-right:7px} .no-padd{padding:0 !important} @media screen and (max-width: 600px){html{margin-top:0}} table{border-collapse:separate;border-spacing:0;border-width:1px 0 0 1px;margin:0 0 1.75em;table-layout:fixed;width:100%} table,th,td{border:1px solid #999;border-collapse:collapse} dd{margin:0 0 1.75em} address{font-style:italic} abbr,acronym{border-bottom:1px dotted #d1d1d1;cursor:help} code{background-color:#d1d1d1;color:#222222} mark,ins{background:#007acc;color:#ffffff;padding:0.125em 0.25em;text-decoration:none} kbd{background-color:transparent;color:#222222;font-weight:100;box-shadow:none;opacity:.9} .alignleft{float:left;margin:0.375em 1.75em 1.75em 0} button,html input[type=button],input[type=reset],input[type=submit]{padding:0 10px;background:#222222;border-color:#222222;color:#ffffff;-webkit-transition:all 300ms ease;transition:all 300ms ease;border-radius:0px} caption{color:#222222;opacity:.7} .main-wrapper{position:relative;overflow:hidden} .sidebar-open #footer{display:none;-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%)} #footer .footer-info{max-width:250px;margin-bottom:25px} #footer .footer-info>img,#footer .footer-info .footer-logo{margin-bottom:39px;max-width:150px;margin-top:5px} #footer .footer-info .footer-logo{max-width:none;font-size:30px;font-weight:800;color:#222;line-height:1} #footer .footer-info .footer-info-text,#footer .footer-info p{font-size:15px;color:#888;line-height:2;margin-bottom:0} #footer .footer-info .footer-info-text a,#footer .footer-info p a{color:inherit;text-decoration:none} #footer .footer-info .footer-info-text a:hover,#footer .footer-info p a:hover{color:#222} #footer.simple .sidebar-item li{color:#888} #footer.simple .sidebar-item[class*='widget_'] a,#footer.simple .sidebar-item[class*='widget_'] label,#footer.simple .sidebar-item[class*='widget_'] p,#footer.simple .sidebar-item[class*='widget_'] strong,#footer.simple .sidebar-item[class*='widget_'] span,#footer.simple .sidebar-item[class*='widget_'] caption{color:#2b2b2b} #footer.simple .sidebar-item[class*='widget_'] a:hover,#footer.simple .sidebar-item[class*='widget_'] a:hover>span{color:#222} #footer>*{text-transform:none} #footer .sidebar-item[class*='widget_'] ul{list-style:none;margin-left:0} #footer .sidebar-item[class*='widget_'] li a{-webkit-transition:0.3s;transition:0.3s} #footer .sidebar-item[class*='widget_'] li a:hover{text-decoration:none;color:#fff;opacity:1} #footer .sidebar-item[class*='widget_'] h5{color:#fff} #footer .sidebar-item[class*='widget_'] a,#footer .sidebar-item[class*='widget_'] label,#footer .sidebar-item[class*='widget_'] p,#footer .sidebar-item[class*='widget_'] strong,#footer .sidebar-item[class*='widget_'] span,#footer .sidebar-item[class*='widget_'] caption{color:#888;text-decoration:none;-webkit-transition:0.35s;transition:0.35s} #footer .sidebar-item[class*='widget_'] p a{opacity:1} #footer .sidebar-item[class*='widget_'] a:hover{text-decoration:none;color:#fff;opacity:1 !important} #footer .sidebar-item[class*='widget_'] select{color:#222222;width:100%} .widget_text .textwidget img{margin-bottom:10px} .widget_text .textwidget,.widget_tag_cloud .tagcloud{margin-top:20px} #footer{display:block;width:100%;margin:auto;min-height:40px;bottom:0;-webkit-transition:-webkit-transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;transition:-webkit-transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;-o-transition:transform 0.5s ease-in-out, transform 0.5s ease-in-out;transition:transform 0.5s ease-in-out, transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;position:absolute;left:0;z-index:30;line-height:2} #footer *{text-transform:none} #footer .menu li a{color:#888;font-size:15px;line-height:2} #footer .sidebar-item .item-wrap{max-width:none;width:100%} #footer .sidebar-item .item-wrap h3{margin-bottom:47px;color:#222222;font-size:15px;font-weight:bold;border-bottom:0} #footer.simple>.container{padding:100px 25px 0} #footer.simple .sidebar-item .item-wrap h5{margin-top:0;margin-bottom:37px;color:#222222;font-size:20px;font-weight:800} #footer.simple .widget_text .textwidget img{margin-bottom:10px} #footer.simple .widget_text .textwidget p,#footer.simple .widget_text .textwidget a{color:#888} #footer.simple .widget_text .textwidget a:hover{color:#222222} #footer .footer-bottom-wrap{padding:40px 0} #footer .footer-bottom-wrap .container-fluid+.container-fluid{margin-top:25px} #footer.classic{padding:15px 85px;background-color:#ffffff} #footer.classic .footer-logo{font-size:30px;font-weight:800;color:#222;line-height:1} #footer.classic .logo{text-decoration:none} #footer.classic .logo span{font-size:28px;line-height:1.8;font-weight:400;color:#222222;text-transform:uppercase} @media only screen and (max-width: 991px){#footer.classic{padding-left:25px;padding-right:25px}} @media only screen and (max-width: 767px){#footer .footer-info{text-align:center;margin-left:auto;margin-right:auto}#footer.simple .sidebar-item .item-wrap h5{margin-bottom:15px}} #footer .copyright{font-size:14px;color:#888} #footer .copyright:not(:first-child){margin-top:10px} #footer .copyright a{color:#2585e6;font-weight:bold;-webkit-transition:all 300ms ease;transition:all 300ms ease;text-decoration:none} #footer .copyright a:hover{color:#222} #footer .sidebar-item{margin-bottom:25px;margin-top:0} #footer .widg .sidebar-item:nth-of-type(3){float:right} #footer .sidebar-item h5{margin-bottom:28px} #footer .sidebar-item li{color:rgba(255,255,255,0.5)} #footer .sidebar-item .text{color:rgba(255,255,255,0.7)} #footer .widget_text h5{color:#fff;font-size:12px;font-weight:600;line-height:2;margin-bottom:40px;text-transform:uppercase} #footer .widget_text .textwidget>p{color:#888;font-size:15px;line-height:1.73;margin-bottom:4px;opacity:1} #footer .widget_text .textwidget a{font-size:15px;line-height:1.73;color:#888;opacity:1} #footer .widget_text .textwidget a:hover{color:#fff} #footer .sidebar-item ul ul ul ul ul ul{margin-left:0} #footer select,#footer img{max-width:100%;height:auto} @media only screen and (min-width: 1199px){#footer .sidebar-item .item-wrap{max-width:260px;display:inline-block}} @media only screen and (max-width: 1024px){#footer.simple>.container{padding-top:80px}#footer .footer-bottom-wrap:not(:last-child){margin-top:30px}} @media only screen and (max-width: 991px){#footer .widg .sidebar-item:nth-of-type(3){float:none}#footer .widget_text{max-width:100%}#footer.simple>.container{padding-top:60px}#footer.simple .sidebar-item:nth-of-type(3n)::before{content:none}#footer.simple .sidebar-item:nth-of-type(3n+1)::after{content:none}#footer .footer-bottom-wrap{margin-top:0}} @media only screen and (max-width: 767px){#footer .footer-bottom-wrap{margin-top:0}#footer.simple .sidebar-item h5{margin-bottom:30px}} @media (max-width: 767px){#footer .footer-bottom-col{text-align:center}#footer .footer-bottom-col:not(:last-child){margin-bottom:25px}#footer .copyright{float:none}#footer .copyright a{padding:0 4px}#footer .sidebar-item .item-wrap{text-align:center}#footer.simple{padding:0}#footer.simple .sidebar-item .item-wrap h3{margin-bottom:25px}#footer .widget_text h5{margin-bottom:20px}#footer .sidebar-item .item-wrap h3{margin-bottom:20px}} .footer-bottom-container{display:flex;align-items:center;margin-left:-15px;margin-right:-15px} .footer-bottom-container .footer-bottom-col{padding:0 15px;flex:1;flex-wrap:wrap;text-align:center} .footer-bottom-container .footer-bottom-col:first-child{text-align:left} .footer-bottom-container .footer-bottom-col:last-child{text-align:right} .footer-bottom-container .footer-bottom-col:last-child:first-child{text-align:center} @media (max-width: 767px){.footer-bottom-container{flex-direction:column}#footer .sidebar-item:last-child:nth-child(2n+1){margin-left:25%}#footer .widg{margin-top:15px;margin-bottom:-30px}} @media (max-width: 370px){#footer .sidebar-item{width:100%}#footer .sidebar-item:last-child:nth-child(2n+1){margin-left:0}} .error404 .main-wrapper{min-height:100vh;overflow-x:hidden;overflow-y:auto} @media only screen and (max-width: 767px){form div{-ms-flex-wrap:wrap;flex-wrap:wrap}} .only_logo:not(.bg-fixed-color) .top-menu{padding:40px 0} .only_logo .top-menu{padding:20px 0} .sidebar-item{margin-bottom:50px} .sidebar-item>h5,.sidebar-item .screen-reader-text{font-size:15px;margin-bottom:21px;line-height:21px;display:block} .sidebar-item .screen-reader-text,.screen-reader-text{display:none} .widget_tag_cloud .tagcloud a{padding:2px 5px;text-decoration:none;margin:3px;display:inline-block;vertical-align:top;font-weight:600} .sidebar-item:first-child{margin-top:0} .sidebar-item h5{width:100%} .sidebar-item ul{margin-left:20px} .sidebar-item ul li a{text-decoration:none;color:#222222} .sidebar-item select{max-width:100%;padding:5px 10px} .sidebar-item select option{max-width:255px;width:100%} .sidebar-item input{border:solid 1px #dddddd;width:100%;padding:16px 18px;color:#888;font-size:15px;line-height:21px;background-color:#fff} .sidebar-item input:focus{border-color:#222;color:#222} .col-md-4 .sidebar-item,.col-md-3 .sidebar-item{margin-bottom:30px} .col-md-4 .sidebar-item li,.col-md-3 .sidebar-item li{list-style:none;font-size:15px;color:#222;line-height:1.8;-webkit-transition:0.3s;transition:0.3s} .col-md-4 .sidebar-item li li,.col-md-3 .sidebar-item li li{opacity:1} .col-md-4 .sidebar-item a,.col-md-4 .sidebar-item span,.col-md-4 .sidebar-item p,.col-md-4 .sidebar-item strong,.col-md-3 .sidebar-item a,.col-md-3 .sidebar-item span,.col-md-3 .sidebar-item p,.col-md-3 .sidebar-item strong{color:#888;font-size:15px !important;font-weight:400;line-height:1.6;-webkit-transition:0.3s;transition:0.3s;opacity:1} .col-md-4 .sidebar-item h5,.col-md-3 .sidebar-item h5{width:100%;line-height:normal} .col-md-4 .sidebar-item a,.col-md-3 .sidebar-item a{text-decoration:none} .col-md-4 .sidebar-item select,.col-md-3 .sidebar-item select{margin:15px 0 5px;border:1px solid rgba(34,34,34,0.2);font-size:15px;line-height:1.6;font-weight:400;color:#2b2b2b;padding-right:7px;background-color:transparent;width:100%} .col-md-4 .widget_tag_cloud a,.col-md-3 .widget_tag_cloud a{background-color:#222222;color:#fff;margin-bottom:10px;-webkit-transition:0.3s;transition:0.3s} .col-md-4 .widget_tag_cloud a:hover,.col-md-3 .widget_tag_cloud a:hover{opacity:0.8} .main-wrapper .col-md-3 .sidebar-item ul ul ul ul ul ul,.main-wrapper .col-md-4 .sidebar-item ul ul ul ul ul ul{margin-left:0} .post-paper table td a{font-weight:bold} .sidebar-item ins{background:none;padding:0} @media only screen and (max-width: 991px){.col-md-4 .sidebar-item,.col-md-3 .sidebar-item{margin-bottom:25px}.sidebar-item ul{margin-left:0}} dt{color:#222} twitterwidget{margin:auto;margin-bottom:35px !important} .post-details ul li:first-of-type,.post-details ol li:first-of-type{margin-top:20px} #footer .sidebar-item[class*='widget_'] ul ul{margin-left:10px} /* style.min.css */ /* blog.min.css */ .category .blog+.sidebar{ margin-top: 30px } .blog,.archive{ height: auto !important } .post-little-banner{ position: relative; background-color: #f7f7f7; padding: 200px 0 125px } .post-little-banner .page-title-blog{ padding-left: 25px; padding-right: 25px; margin-bottom: 0; color: #222222; font-size: 60px; text-align: center } .post-little-banner .page-title-blog span{ color: #0073e6 } .post-paper{ top: 0; background-color: #f7f7f7 } .post-paper.no-vc{ background-color: #fff } .post-paper>.container{ -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none } @media screen and (max-width: 1200px){.blog .blog.archive{ margin-top: 40px }.blog .blog.archive+.sidebar{ margin-top: 40px }} @media screen and (max-width: 767px){.blog .blog.archive{ margin-top: 20px }.blog .blog.archive.col-md-9{ padding: 0 }.blog+.sidebar{ margin-top: 30px; margin-bottom: 50px; padding-left: 25px; padding-right: 25px }} .single-post .main-wrapper{ background-color: #f7f7f7 } .single-post .main-top-content{ padding-top: 50px } .single-post .single-content{ background-color: #ffffff } .single-post .title{ -ms-word-wrap: break-word; word-wrap: break-word; font-size: 50px; font-weight: 800; color: #222; line-height: normal; max-width: 770px; margin-bottom: 20px } .single-post p{ font-size: 15px; line-height: 1.6; font-weight: 400; color: #888; margin-bottom: 10px } .single-post .single-content blockquote{ margin: 30px 0px; text-align: center } .single-post .single-content blockquote p,.post-paper blockquote p{ font-size: 24px; line-height: 1.5; font-weight: bold; color: #222222; text-align: center; font-style: normal; margin: 0 } .single-post .single-content blockquote p::before,.post-paper blockquote p::before{ display: block; margin-bottom: 20px; color: #888; font-family: "Ionicons", sans-serif; font-size: 40px; content: "\f347" } .page ol ol,.page ul ol,.page ul,.page ul,.single-content ol ol,.single-content ul ol,.single-content ul,.single-content ol{ margin-left: 20px } .page ol ul>li,.page ul ul>li,.single-content ol ul>li,.single-content ul ul>li{ margin-left: 20px } .single-post .single-content .swiper-container{ max-width: 770px; margin: 42px auto 35px; border-bottom: 1px solid #F2F2F2 } .single-post .single-content .swiper-arrow-right{ right: 0; text-align: right } .single-post .single-content .swiper-arrow-left{ left: 0 } .single-post .single-content .swiper-arrow-right div,.single-post .single-content .swiper-arrow-left div{ position: relative; top: 50%; line-height: 2; margin-top: 3px; -webkit-transform: translateY(-50%); transform: translateY(-50%); display: inline-block } .single-post .single-content .swiper-arrow-right div i,.single-post .single-content .swiper-arrow-left div i{ font-size: 40px } .single-post .single-content .swiper-arrow-right,.single-post .single-content .swiper-arrow-left{ width: 50px; background-color: #fff; font-size: 14px; color: #222222; display: inline-block; cursor: pointer; position: absolute; bottom: calc((100% - 650px) / 2); height: calc(100% - 650px); -webkit-transform: translateY(50%); transform: translateY(50%); z-index: 15 } .single-post .single-content .swiper-arrow-left{ text-align: left } .single-post .single-content .swiper-arrow-right{ text-align: right } .single-post .post-little-banner{ padding-top: 120px; padding-bottom: 120px; margin-bottom: 20px } .post-little-banner .main-top-content{ position: absolute; left: 50%; width: 100%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: calc(50% - 25px) } .post-little-banner .main-top-content>*{ color: #222222 } .single-post dl dd{ color: #888 } .main-wrapper .col-md-4 .sidebar-item,.main-wrapper .col-md-3 .sidebar-item{ padding: 20px; margin-left: 0; background-color: #ffffff } .main-wrapper .col-md-4 .sidebar-item ul li,.main-wrapper .col-md-3 .sidebar-item ul li{ padding-top: 8px } .main-wrapper .col-md-4 .sidebar-item ul li li,.main-wrapper .col-md-3 .sidebar-item ul li li{ border-bottom: none; padding-bottom: 0 } .main-wrapper .col-md-4 .sidebar-item>ul>li:last-child,.main-wrapper .col-md-4 .sidebar-item>div>ul>li:last-child,.main-wrapper .col-md-3 .sidebar-item>ul>li:last-child,.main-wrapper .col-md-3 .sidebar-item>div>ul>li:last-child{ border-bottom: none; padding-bottom: 0; margin-bottom: -10px } .main-wrapper .col-md-4 .sidebar-item h5,.main-wrapper .col-md-3 .sidebar-item h5{ border-bottom: 1px solid rgba(34, 34, 34, 0.2); display: block; font-size: 18px; font-weight: 800; text-align: left; margin-bottom: 10px; line-height: 1.6 } .main-wrapper .col-md-4 .sidebar-item li,.main-wrapper .col-md-4 .sidebar-item p,.main-wrapper .col-md-3 .sidebar-item li,.main-wrapper .col-md-3 .sidebar-item p{ color: #222 } .main-wrapper .col-md-4 .sidebar-item a:hover,.main-wrapper .col-md-3 .sidebar-item a:hover{ color: #0073e6; opacity: 1 } .main-wrapper .col-md-4 .sidebar-item ul,.main-wrapper .col-md-3 .sidebar-item ul{ margin-left: 0 } .main-wrapper .col-md-4 .sidebar-item ul ul,.main-wrapper .col-md-3 .sidebar-item ul ul{ margin-left: 10px } .main-wrapper .col-md-4 .sidebar-item h1,.main-wrapper .col-md-4 .sidebar-item h2,.main-wrapper .col-md-4 .sidebar-item h3,.main-wrapper .col-md-4 .sidebar-item h4,.main-wrapper .col-md-4 .sidebar-item h5,.main-wrapper .col-md-4 .sidebar-item h6,.main-wrapper .col-md-4 .sidebar-item strong,.main-wrapper .col-md-3 .sidebar-item h1,.main-wrapper .col-md-3 .sidebar-item h2,.main-wrapper .col-md-3 .sidebar-item h3,.main-wrapper .col-md-3 .sidebar-item h4,.main-wrapper .col-md-3 .sidebar-item h5,.main-wrapper .col-md-3 .sidebar-item h6,.main-wrapper .col-md-3 .sidebar-item strong{ color: #222222 } .main-wrapper .col-md-4 .sidebar-item strong,.main-wrapper .col-md-3 .sidebar-item strong{ font-weight: 600 } .main-wrapper .col-md-4 .sidebar-item.widget_tag_cloud a,.main-wrapper .col-md-3 .sidebar-item.widget_tag_cloud a{ color: #fff; font-size: 14px !important; line-height: 1.6; margin-right: 10px; padding: 2px 7px; font-weight: 600; background-color: #0073e6; transition: color .3s ease, background-color .3s ease } .main-wrapper .col-md-4 .sidebar-item.widget_tag_cloud a:hover,.main-wrapper .col-md-3 .sidebar-item.widget_tag_cloud a:hover{ background-color: #222 } .main-wrapper .col-md-4 .sidebar-item table,.main-wrapper .col-md-3 .sidebar-item table{ color: #222222 } .main-wrapper .col-md-4 .sidebar-item table th,.main-wrapper .col-md-4 .sidebar-item table a,.main-wrapper .col-md-3 .sidebar-item table th,.main-wrapper .col-md-3 .sidebar-item table a{ color: #222222; font-weight: 800 } .main-wrapper .col-md-4 .sidebar-item table caption,.main-wrapper .col-md-3 .sidebar-item table caption{ color: #222222; opacity: 1; font-weight: bold; text-align: center } .main-wrapper .single-content+.col-md-4,.main-wrapper .single-content+.col-md-3{ position: relative; z-index: 9 } .error404 #footer{ background-color: #fff; position: absolute } @media only screen and (max-width: 1024px){.single-post .single-content .swiper-arrow-right,.single-post .single-content .swiper-arrow-left{ bottom: calc((100% - 550px) / 2); height: calc(100% - 550px) }} @media only screen and (max-width: 991px){.single-post .single-content .swiper-arrow-right,.single-post .single-content .swiper-arrow-left{ bottom: calc((100% - 400px) / 2); height: calc(100% - 400px) }.post-little-banner{ padding: 100px 0 60px }.post-little-banner .page-title-blog{ font-size: 45px }} @media screen and (max-width: 767px){.single-post .title{ font-size: 40px }.single-post p{ margin-bottom: 15px }.post-little-banner{ padding: 100px 0 50px }.post-little-banner .page-title-blog{ font-size: 36px }} @media (max-width: 767px){.single-post .single-content blockquote p,.post-paper blockquote p{ font-size: 20px }.single-post .title{ font-size: 40px; line-height: 50px }.single-post .single-content blockquote{ padding: 15px 0 }.padding-both>.container{ padding: 15px 15px 15px !important }.single-post .padding-both{ top: -50px }.single-post .post-paper{ text-align: center }.page-title-blog{ font-size: 28px }.single-post .post-little-banner{ min-height: auto !important; padding: 40px 15px; margin-bottom: 0 }} @media screen and (max-width: 600px){.single-post .title{ font-size: 30px }} @media only screen and (max-width: 600px){.single-post .single-content .swiper-arrow-right,.single-post .single-content .swiper-arrow-left{ bottom: calc((100% - 300px) / 2); height: calc(100% - 300px) }.post-banner{ min-height: 200px }.single-post .single-content blockquote{ margin: 15px 0 }} @media only screen and (max-width: 380px){.single-post .single-content .swiper-arrow-right,.single-post .single-content .swiper-arrow-left{ bottom: calc((100% - 200px) / 2); height: calc(100% - 200px) }} .pagination{ width: 100%; text-align: center; margin: 37px 0 0 } .pager-pagination{ position: relative; text-align: center; clear: both; padding: 10px 0 80px; z-index: 5 } .page-numbers{ border: 1px solid #888; display: inline-block; font-size: 18px; font-weight: bold; line-height: normal; margin-right: 10px; margin-left: 10px; text-align: center; padding: 14px 20px; color: #888; text-decoration: none; margin-bottom: 10px; border-radius: 22px } @media (min-width: 768px){.page-numbers{ border-radius: 32px }} .page-numbers:hover,.page-numbers:focus{ color: #222; border: 1px solid #222; opacity: 1 } .next.page-numbers,.prev.page-numbers{ display: none } .next.page-numbers{ position: relative; padding-right: 30px } .next.page-numbers i{ position: absolute; right: 18px; top: 48%; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: right 350ms ease; transition: right 350ms ease } .next.page-numbers:hover i{ right: 14px } .prev.page-numbers{ position: relative; padding-left: 30px } .prev.page-numbers i{ position: absolute; left: 18px; top: 48%; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: left 350ms ease; transition: left 350ms ease } .prev.page-numbers:hover i{ left: 14px } .pager-pagination .current{ color: #222; border: 1px solid #222 } .pager-pagination .current{ background-color: #0073e6; border-color: #0073e6 !important; color: #fff } @media screen and (max-width: 767px){.page-numbers{ padding: 10px 16px; font-size: 16px }} .main-top-content{ margin-bottom: 60px } .post-banner{ max-width: 770px; margin: 0 auto 40px; position: relative; background-position: center; background-repeat: no-repeat; background-size: cover; background-color: #ffffff } .post-details ul li,.post-details ol li{ margin-bottom: 20px; color: #888; font-size: 15px } .main-top-content{ margin: 60px auto } .main-top-content{ margin: 60px auto 40px } .post-banner .main-top-content{ position: absolute; top: calc(50% + 50px); left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 200; width: 100% } .single table td,.single table th,table td,table th{ padding: 7px } .single blockquote{ border: none; margin-top: -7px; margin-bottom: 23px } @media only screen and (max-width: 1199px){.main-top-content{ margin: 60px 0 30px }.single-post .main-top-content{ padding-top: 40px }} @media screen and (max-width: 991px){.pager-pagination{ padding: 30px 10px 60px }.post-banner{ margin-bottom: 30px }} @media (max-width: 767px){.single-post .main-top-content{ padding-top: 0 }.post-details .main-top-content,.post-details p{ word-wrap: break-word }.post-details .title{ margin-bottom: 30px; font-size: 40px }.post-details .title{ line-height: 1.2 }} @media screen and (max-width: 991px){.main-wrapper .col-md-4 .sidebar-item h5,.main-wrapper .col-md-3 .sidebar-item h5{ text-align: center }.post-banner{ min-height: 400px }.single-post .single-content{ margin-top: 50px }.single-post .title{ font-size: 40px; line-height: 1.2 }} @media (max-width: 991px){.blog .blog.archive{ margin-top: 0 }} @media only screen and (max-width: 767px){.main-wrapper .col-md-3 .sidebar-item>ul{ margin-left: 0 }.main-wrapper .col-md-3 .sidebar-item ul ul{ margin-left: 15px }.post-paper .blog{ padding: 0 10px }.single-post .single-content>p,.single-post .single-content>h1,.single-post .single-content>h2,.single-post .single-content>h3,.single-post .single-content>h4,.single-post .single-content>h5,.single-post .single-content>h6,.single-post .single-content>blockquote,.single-post .single-content>ul,.single-post .single-content>address,.single-post .single-content>table,.single-post .single-content>pre,.single-post .single-content>dl,.single-post .single-content>ol{ margin-right: 0; margin-left: 0 }.main-wrapper .main-top-content{ top: 50% }.main-wrapper .main-top-content .title{ margin-bottom: 20px; font-size: 26px }.main-top-content,.post-banner{ margin: 30px 0 }.post-banner{ margin-bottom: 30px }.single-post .main-wrapper{ background-color: #ffffff }.single-post .single-content{ margin-top: 30px; padding-left: 10px; padding-right: 10px }.single-post .single-content blockquote{ margin: 10px 0 }.single-post .single-content blockquote p::before{ line-height: 1.1em }.col-md-3 .sidebar-item,.col-md-4 .sidebar-item{ margin-bottom: 15px }} @media only screen and (max-width: 600px){.single-post .single-content .swiper-arrow-right,.single-post .single-content .swiper-arrow-left{ bottom: calc((100% - 300px) / 2); height: calc(100% - 300px) }.post-banner{ min-height: 200px }.single-post .single-content blockquote{ margin: 15px 0 }} @media (max-width: 480px){.single blockquote{ padding: 26px 26px 26px 36px }.pagination{ margin: 15px 0 0 }.post-details .title{ font-size: 30px }.single blockquote{ font-size: 16px; padding: 26px }.single-content p{ margin-bottom: 15px }} /* full-kaiten.css */ body{ font-family: "Roboto", "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 16px; font-weight: 400; } a{ color: #2d5dea; } a:hover{ color: #1e3c8c; } h1,h2,h3,h4,h5,h6{ font-family: "Roboto", "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: 700; } strong,b{ font-weight: 700; } .single-post h1,.single-post h2,.single-post h3,.single-post h4,.single-post h5,.single-post h6{ font-family: "Roboto", "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: 700; } p{ font-family: "Roboto", "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: 400; } ::-moz-selection{ background: #1e3c8c; } ::selection{ background: #1e3c8c; } .breadcrumbs{ color: #a5a9b1; display: none; font-size: 14px; line-height: 1.5; margin-top: 12px; margin-bottom: 48px; padding: 0 10px; } @media (min-width: 768px){.breadcrumbs{ display: block; }} .breadcrumbs a{ color: #787e8a; } .breadcrumbs a:hover{ color: #1e3c8c; } .pager-pagination{ padding-top: 25px; } .pager-pagination .pagination{ margin-top: 0; } .pager-pagination .current{ background-color: #1e3c8c; border-color: #1e3c8c !important; } @media (max-width: 991px){.row-has-sidebar .pager-pagination{ padding-bottom: 0; }} a.btn-common{ background-color: #1e3c8c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #1e3c8c)); background-image: linear-gradient(to right, transparent 50%, #1e3c8c 50%); background-size: 200% 100%; background-position: right center; font-size: 16px; font-weight: 700; line-height: 18px; padding: 12px 0; width: 240px; text-align: center; white-space: nowrap; border-radius: 30px; color: #fff; border: 2px solid #1e3c8c; display: block; margin: 0 auto; } a.btn-common:hover{ background-color: transparent; background-position: left center; } @media screen and (min-width: 768px){a.btn-common{ font-size: 18px; padding: 12px 0; }} a.btn-common:hover{ color: #1e3c8c; text-decoration: none; } .row-eq-height{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .cta{ background: #1e3c8c; background-image: url("/assets/images/CTA-bg.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover; color: #fff; padding: 40px 15px; text-align: center; } @media (min-width: 768px){.cta{ padding: 40px 25px; }} @media (min-width: 992px){.cta{ text-align: left; padding: 60px 0; }} .cta.ZD{ background-image: url("/assets/images/ZD-CTA-bg.jpg"); } .cta.SA{ background-image: url("/assets/images/SA-CTA-bg.jpg"); } .cta.DB{ background-image: url("/assets/images/DB-CTA-bg.jpg"); } .cta.WS{ background-image: url("/assets/images/WS-CTA-bg.jpg"); } .cta.SPL{ background-image: url("/assets/images/SPL-CTA-bg.jpg"); } .cta .cta-title{ color: #fff; font-size: 18px; font-weight: 700; line-height: 1.5; letter-spacing: 1px; margin: 0 0 20px; text-align: center; } @media (min-width: 768px){.cta .cta-title{ font-size: 20px; margin: 0 0 20px; }} @media (min-width: 992px){.cta .cta-title{ font-size: 22px; letter-spacing: 2px; }} @media (min-width: 1200px){.cta .cta-title{ font-size: 24px; letter-spacing: 2px; }} .cta .cta-link{ text-align: center; } .cta .cta-link a{ background-color: #1e283c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #1e283c)); background-image: linear-gradient(to right, #fff 50%, #1e283c 50%); background-size: 200% 100%; background-position: right center; color: #fff; display: inline-block; font-size: 16px; font-weight: bold; line-height: 1; margin: 0 0 16px; padding: 20px 0px 18px; white-space: nowrap; border-radius: 40px; width: 280px; } .cta .cta-link a:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.cta .cta-link a{ font-size: 20px; padding: 24px 32px 20px; margin: 0 0 16px; width: 360px; }} @media (min-width: 992px){.cta .cta-link a{ font-size: 24px; margin: 0 0 24px; width: 440px; }} .cta .cta-link a:hover{ color: #1e283c; } .cta .cta-link a i{ font-size: 20px; margin-right: 6px; margin-top: -2px; vertical-align: middle; } @media screen and (min-width: 768px){.cta .cta-link a i{ font-size: 24px; margin-right: 8px; margin-top: -3px; }} @media screen and (min-width: 992px){.cta .cta-link a i{ font-size: 32px; margin-right: 12px; margin-top: -3px; }} .cta .cta-link a.ZD{ background-color: #FFC800; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #FFC800)); background-image: linear-gradient(to right, #fff 50%, #FFC800 50%); background-size: 200% 100%; background-position: right center; border: none; color: #1e3c8c; display: inline-block; font-size: 16px; font-weight: bold; line-height: 1; margin: 0 0 20px; white-space: nowrap; } .cta .cta-link a.ZD:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.cta .cta-link a.ZD{ font-size: 20px; margin: 0 0 20px; }} @media (min-width: 992px){.cta .cta-link a.ZD{ font-size: 24px; margin: 0 0 24px; }} .cta .cta-link a.ZD:hover{ color: #1e3c8c; } .cta .cta-link a.SA{ background-color: #ff7800; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #ff7800)); background-image: linear-gradient(to right, #fff 50%, #ff7800 50%); background-size: 200% 100%; background-position: right center; border: none; color: #ffffff; display: inline-block; font-size: 16px; font-weight: bold; line-height: 1; margin: 0 0 20px; white-space: nowrap; } .cta .cta-link a.SA:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.cta .cta-link a.SA{ font-size: 20px; margin: 0 0 20px; }} @media (min-width: 992px){.cta .cta-link a.SA{ font-size: 24px; margin: 0 0 24px; }} .cta .cta-link a.SA:hover{ color: #1e283c; } .cta .cta-link a.DB,.cta .cta-link a.WS{ background-color: #1e283c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #1e283c)); background-image: linear-gradient(to right, #fff 50%, #1e283c 50%); background-size: 200% 100%; background-position: right center; border: none; color: #ffffff; display: inline-block; font-size: 16px; font-weight: bold; line-height: 1; margin: 0 0 20px; white-space: nowrap; } .cta .cta-link a.DB:hover,.cta .cta-link a.WS:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.cta .cta-link a.DB,.cta .cta-link a.WS{ font-size: 20px; margin: 0 0 20px; }} @media (min-width: 992px){.cta .cta-link a.DB,.cta .cta-link a.WS{ font-size: 24px; margin: 0 0 24px; }} .cta .cta-link a.DB:hover,.cta .cta-link a.WS:hover{ color: #1e283c; } .cta .cta-link a.AL{ background-color: #ff9800; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #ff9800)); background-image: linear-gradient(to right, #fff 50%, #ff9800 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #ff9800; color: #fff; display: inline-block; font-size: 16px; font-weight: bold; line-height: 1; margin: 0 0 10px; padding: 18px 0px; white-space: nowrap; border-radius: 40px; width: 280px; } .cta .cta-link a.AL:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.cta .cta-link a.AL{ font-size: 20px; padding: 24px 32px; margin: 0 0 10px; width: 360px; }} @media (min-width: 992px){.cta .cta-link a.AL{ font-size: 24px; margin: 0 0 24px; width: 440px; }} .cta .cta-link a.AL:hover{ color: #ff9800; } .cta .cta-link a.AL i{ font-size: 20px; margin-right: 6px; margin-top: -2px; vertical-align: middle; } @media screen and (min-width: 768px){.cta .cta-link a.AL i{ font-size: 24px; margin-right: 8px; margin-top: -3px; }} @media screen and (min-width: 992px){.cta .cta-link a.AL i{ font-size: 32px; margin-right: 8px; margin-top: -3px; }} .cta .cta-link a.SPL{ background-color: #1e283c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #1e283c)); background-image: linear-gradient(to right, #fff 50%, #1e283c 50%); background-size: 200% 100%; background-position: right center; border: none; color: #fff; display: inline-block; font-size: 16px; font-weight: bold; line-height: 1; margin: 0 0 20px; white-space: nowrap; } .cta .cta-link a.SPL:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.cta .cta-link a.SPL{ font-size: 20px; margin: 0 0 20px; }} @media (min-width: 992px){.cta .cta-link a.SPL{ font-size: 24px; margin: 0 0 24px; }} .cta .cta-link a.SPL:hover{ color: #1e283c; } .cta .cta-link a.SPL i{ font-size: 20px; margin-right: 6px; margin-top: -2px; vertical-align: middle; } @media screen and (min-width: 768px){.cta .cta-link a.SPL i{ font-size: 24px; margin-right: 8px; margin-top: -3px; }} @media screen and (min-width: 992px){.cta .cta-link a.SPL i{ font-size: 32px; margin-right: 8px; margin-top: -3px; }} .cta .cta-link a.inquiry{ background-color: transparent; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #ffffff), color-stop(50%, transparent)); background-image: linear-gradient(to right, #ffffff 50%, transparent 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #ffffff; color: #fff; display: inline-block; font-size: 16px; font-weight: bold; line-height: 1; margin: 0; padding: 12px 0px; white-space: nowrap; border-radius: 40px; width: 120px; } .cta .cta-link a.inquiry:hover{ background-color: #ffffff; background-position: left center; } @media (min-width: 768px){.cta .cta-link a.inquiry{ font-size: 18px; padding: 12px 0; width: 120px; }} .cta .cta-link a.inquiry:hover{ color: #1e283c; } .cta .cta-link a.inquiry.ZD:hover{ color: #1e283c; } .cta .cta-link a.inquiry.DB:hover,.cta .cta-link a.inquiry.WS:hover{ color: #1e283c; } .cta .cta-link a.sub{ background-color: transparent; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, transparent)); background-image: linear-gradient(to right, transparent 50%, transparent 50%); background-size: 200% 100%; background-position: right center; color: #fff; display: inline-block; font-size: 16px; font-weight: bold; line-height: 1; margin: 0; padding: 8px 0px; border: none; width: auto; } .cta .cta-link a.sub:hover{ background-color: transparent; background-position: left center; } @media (min-width: 768px){.cta .cta-link a.sub{ font-size: 18px; padding: 8px 0; }} .cta .cta-link a.sub:hover{ color: #FFC800; } .cta .cta-link a.sub i{ font-size: 16px; margin-left: 6px; margin-top: -3px; vertical-align: middle; } @media screen and (min-width: 768px){.cta .cta-link a.sub i{ font-size: 20px; margin-left: 8px; margin-top: -3px; }} .cta .cta-link a.wp{ background-color: transparent; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #1e3c8c), color-stop(50%, transparent)); background-image: linear-gradient(to right, #1e3c8c 50%, transparent 50%); background-size: 200% 100%; background-position: right center; color: #fff; } .cta .cta-link a.wp:hover{ background-color: #1e3c8c; background-position: left center; } .cta .cta-link a.wp:hover{ color: #fff; } .floating-ban{ position: fixed; z-index: 20; bottom: 0; right: 0; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .floating-ban .pc{ width: 320px; margin: 0 30px 30px 0; } .floating-ban .pc img{ width: 100%; border-radius: 8px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .floating-ban .pc img:hover{ opacity: 0.8; } .floating-ban .pc .Bnr{ display: none; position: relative; } .floating-ban .pc .Bnr .close{ position: absolute; right: -12px; top: -4px; opacity: 1.0; } .floating-ban .pc .Bnr .close a{ display: block; width: 24px; height: 24px; text-align: center; background-color: #1e283c; border-radius: 12px; font-size: 16px; line-height: 22px; color: #ffffff; } .floating-ban .pc .Bnr .close a:hover{ opacity: 0.7; } .floating-ban .pc .Bnr .close a span{ display: block; width: 1px; height: 1px; overflow: hidden; } .floating-ban .sp{ display: none; } @media (max-width: 768px){.floating-ban .pc{ display: none; }.floating-ban .sp{ display: block; width: 160px; margin: 0 20px 20px 0; }.floating-ban .sp img{ border-radius: 8px; width: 100%; }.floating-ban .sp img:hover{ opacity: 0.8; }.floating-ban .sp .Bnr{ display: none; position: relative; }.floating-ban .sp .Bnr .close{ position: absolute; right: -12px; top: -8px; opacity: 1.0; }.floating-ban .sp .Bnr .close a{ display: block; width: 24px; height: 24px; text-align: center; background-color: #1e283c; border-radius: 12px; font-size: 16px; line-height: 22px; color: #ffffff; }.floating-ban .sp .Bnr .close a:hover{ opacity: 0.7; }.floating-ban .sp .Bnr .close a img{ width: 100%; border-radius: 8px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }.floating-ban .sp .Bnr .close a span{ display: block; width: 1px; height: 1px; overflow: hidden; }} .right-menu.classic{ margin: auto; max-width: 100%; padding-left: 0 !important; padding-right: 0 !important; } @media (min-width: 480px){.right-menu.classic{ max-width: 100%; }} @media (max-width: 767px){.right-menu.classic{ padding-top: 12px !important; padding-bottom: 12px !important; }} @media (min-width: 768px) and (max-width: 991px){.right-menu.classic{ padding-top: 20px !important; padding-bottom: 20px !important; }} @media (min-width: 992px){.right-menu.classic{ max-width: 100%; padding: 0 10px !important; }} @media (min-width: 1200px){.right-menu.classic{ max-width: 100%; }} .right-menu.classic .logo{ -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } .right-menu.classic .logo:hover{ opacity: 0.8; } .right-menu.classic .logo img{ max-width: 160px; } @media (min-width: 768px){.right-menu.classic .logo img{ max-width: 160px; }} @media (min-width: 992px){.right-menu.classic .logo img{ max-width: 200px; }} @media (min-width: 1200px){.right-menu.classic .logo img{ max-width: 240px; }} @media (max-width: 991px){.right-menu.classic .logo img.logo-mobile{ padding: 0; }} .right-menu.classic .logo span{ color: #fff; } @media (min-width: 992px){.right-menu.classic #topmenu{ padding-left: 25px; }} @media (min-width: 1200px){.right-menu.classic #topmenu{ padding-left: 30px; }} @media (max-width: 991px){.right-menu.classic #topmenu > ul{ padding-bottom: 0px; }} .right-menu.classic #topmenu > ul > li a{ margin-right: 6px; font-size: 14px; width: 100% !important; font-family: "Roboto", "Noto Sans JP", sans-serif !important; } @media (min-width: 1280px){.right-menu.classic #topmenu > ul > li a{ margin-right: 16px; font-size: 16px; width: auto; }} .right-menu.classic #topmenu .mob-nav-close{ color: #a5a9b1; } .right-menu.classic #topmenu .menu{ text-align: left; } .right-menu.classic #topmenu .menu a[href="#"]{ cursor: default; pointer-events: none; } .right-menu.classic #topmenu .menu a[href="#"]::after{ content: "\f107"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-align: center; text-rendering: auto; width: 16px; } @media (max-width: 991px){.right-menu.classic #topmenu .menu a[href="#"]::after{ content: none; }} .right-menu.classic #topmenu .menu li{ vertical-align: middle; } .right-menu.classic #topmenu .menu li.current-menu-parent > a,.right-menu.classic #topmenu .menu li.current-menu-item > a{ font-weight: 700; } .right-menu.classic #topmenu .menu li a{ color: #fff; font-weight: normal; } @media (max-width: 991px){.right-menu.classic #topmenu .menu li a{ color: #1e283c; }} .right-menu.classic #topmenu .menu li a:hover{ color: #fff; opacity: 0.6; } @media (max-width: 991px){.right-menu.classic #topmenu .menu li a:hover{ color: #1e283c; }} @media (min-width: 992px){.right-menu.classic #topmenu .menu .sub-menu{ -webkit-box-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.3); box-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.3); border-radius: 8px; left: -12px; padding: 20px 0; min-width: 320px; }.right-menu.classic #topmenu .menu .sub-menu li{ padding: 8px 24px; }} .right-menu.classic #topmenu .menu .sub-menu li.current-menu-item a{ font-weight: 600; line-height: 1.5; } .right-menu.classic #topmenu .menu .sub-menu li.current-menu-item a:hover{ opacity: 0.6; } .right-menu.classic #topmenu .menu .sub-menu li a{ color: #1e283c; margin-right: 0; } .right-menu.classic #topmenu .menu .sub-menu li a span{ color: #787e8a; } .right-menu.classic #topmenu .tel{ width: 108px; } .right-menu.classic #topmenu .tel.pc{ display: none; } @media (min-width: 992px){.right-menu.classic #topmenu .tel.pc{ display: inline-block; width: 84px; padding-top: 2px; padding-right: 2px; }.right-menu.classic #topmenu .tel.pc img{ width: 84px; }} @media (min-width: 1200px){.right-menu.classic #topmenu .tel.pc{ display: inline-block; width: 108px; padding-top: 4px; padding-right: 4px; }.right-menu.classic #topmenu .tel.pc img{ width: 108px; }} .right-menu.classic #topmenu .tel.pc.alt{ display: none; } .right-menu.classic #topmenu .tel.mobile{ display: none; } @media (max-width: 991px){.right-menu.classic #topmenu .tel.mobile{ display: inline-block; margin-bottom: 10px; }.right-menu.classic #topmenu .tel.mobile img{ width: 108px; }} .right-menu.classic #topmenu .search-icon-wrapper{ cursor: default; margin-left: 6px; margin-bottom: 10px; } @media (min-width: 992px){.right-menu.classic #topmenu .search-icon-wrapper{ margin-bottom: 0px; }} .right-menu.classic #topmenu .search-icon-wrapper .cta-btn{ background-color: #1e283c; font-size: 14px; font-weight: bold; line-height: 1; width: 200px; padding: 10px 24px; text-align: center; white-space: nowrap; border-radius: 30px; color: #ffffff; display: inline-block; border: 1px solid #1e283c; } @media (min-width: 992px){.right-menu.classic #topmenu .search-icon-wrapper .cta-btn{ background-color: rgba(255, 255, 255, 0.05); color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.2); font-weight: bold; line-height: 1; text-align: center; white-space: nowrap; border-radius: 30px; display: inline-block; font-size: 14px; padding: 10px 12px; width: auto; }} @media (min-width: 1200px){.right-menu.classic #topmenu .search-icon-wrapper .cta-btn{ font-size: 16px; padding: 12px 24px; }} .right-menu.classic #topmenu .search-icon-wrapper .cta-btn:hover{ color: #ffffff; border: 1px solid #1e3c8c; } @media (min-width: 992px){.right-menu.classic #topmenu .search-icon-wrapper .cta-btn:hover{ background-color: rgba(30, 40, 60, 0.8); border: 1px solid rgba(30, 40, 60, 0.8); }} .right-menu.classic #topmenu .search-icon-wrapper .cta-btn.alt{ background-color: #ffffff; color: #1e283c; } .right-menu.classic #topmenu .search-icon-wrapper .cta-btn.alt:hover{ color: #ffffff; border: 1px solid #1e3c8c; } @media (min-width: 992px){.right-menu.classic #topmenu .search-icon-wrapper .cta-btn.alt{ background-color: rgba(255, 255, 255, 0.05); color: #ffffff; }.right-menu.classic #topmenu .search-icon-wrapper .cta-btn.alt:hover{ background-color: rgba(30, 40, 60, 0.8); border: 1px solid rgba(30, 40, 60, 0.8); color: #ffffff; }} .right-menu.classic .mob-nav .line{ background: #fff; } .header_top_bg.bg-fixed-color .right-menu #topmenu .tel.pc{ display: none; } .header_top_bg.bg-fixed-color .right-menu #topmenu .tel.pc.alt{ display: inline-block; } @media (max-width: 991px){.header_top_bg.bg-fixed-color .right-menu #topmenu .tel.pc.alt{ display: none; }} .header_top_bg.bg-fixed-color .right-menu #topmenu .menu li a{ color: #1e283c; } .header_top_bg.bg-fixed-color .right-menu #topmenu .menu li a:hover{ color: #1e283c; } .header_top_bg.bg-fixed-color .right-menu #topmenu .search-icon-wrapper .cta-btn{ background-color: #1e283c; color: #ffffff; border: 1px solid #1e283c; } .header_top_bg.bg-fixed-color .right-menu #topmenu .search-icon-wrapper .cta-btn:hover{ background-color: #1e3c8c; color: #ffffff; border: 1px solid #1e3c8c; } .header_top_bg.bg-fixed-color .right-menu #topmenu .search-icon-wrapper .cta-btn.alt{ background-color: #ffffff; color: #1e283c; border-color: #1e283c; } .header_top_bg.bg-fixed-color .right-menu #topmenu .search-icon-wrapper .cta-btn.alt:hover{ background-color: #1e3c8c; color: #ffffff; border: 1px solid #1e3c8c; } .header_top_bg.bg-fixed-color .right-menu .mob-nav .line{ background: #1e3c8c !important; } .header_trans-fixed.header_top_bg.bg-fixed-color{ background: transparent !important; -webkit-box-shadow: 0 4px 30px rgba(30, 60, 140, 0.08); box-shadow: 0 4px 30px rgba(30, 60, 140, 0.08); border-bottom: 1px solid rgba(255, 255, 255, 0.4); } .header_trans-fixed.header_top_bg.bg-fixed-color::before{ content: ""; position: absolute; inset: 0; background: rgba(255, 255, 255, 0.6); -webkit-backdrop-filter: blur(16px) saturate(180%); backdrop-filter: blur(16px) saturate(180%); z-index: -1; pointer-events: none; } @media (max-width: 991px){.right-menu #topmenu .menu li.menu-item-has-children i,#topmenu .menu li.menu-item-has-children i{ position: absolute; top: 0px !important; right: 0px !important; width: 100% !important; padding-top: 19px; padding-bottom: 19px; padding-right: 28px; text-align: right; }} .only_logo .top-menu{ height: 50px !important; padding: 10px 0 !important; text-align: left !important; } @media (max-width: 991px){.only_logo .top-menu{ height: 40px !important; padding: 10px 0 !important; }} .only_logo .top-menu .main-logo{ width: 180px; } .only_logo .top-menu .main-logo.logo-mobile{ padding: 0 !important; width: 120px; } .only_logo .top-menu .logo-hover{ width: 180px; } @media (max-width: 991px){.only_logo .top-menu .logo-hover{ hpadding: 0 !important; width: 120px; }} #footer.simple{ background: #fff; position: relative; } #footer.simple > .container:first-child{ border-bottom: 1px solid #e8e9eb; } @media (max-width: 991px){#footer.simple .footer-info{ margin-left: auto; margin-right: auto; max-width: 100%; text-align: center; }} #footer.simple .footer-info .footer-logo{ margin-top: -10px; margin-bottom: 0; } #footer.simple .footer-info .footer-info-text p{ margin-top: 15px; margin-bottom: 48px; font-size: 12px; text-align: center; } @media (max-width: 991px){#footer.simple .footer-info .footer-info-text p{ font-size: 14px; margin-top: 10px; margin-bottom: 20px; }} #footer.simple .footer-info .footer-info-media{ padding-right: 10px; } @media (max-width: 991px){#footer.simple .footer-info .footer-info-media{ padding-right: 0; }} #footer.simple .footer-info .footer-info-media a{ font-size: 14px; text-align: center; color: #1e3c8c; display: block; margin: 0 0 8px; background-color: #f4f6fA; border-radius: 20px; padding: 4px 20px; } @media (max-width: 991px){#footer.simple .footer-info .footer-info-media a{ display: inline-block; padding: 0 20px; margin: 0 5px; }} #footer.simple .footer-info .footer-info-media a:hover{ opacity: 0.6; } #footer.simple .copyright{ color: #787e8a !important; } #footer.simple .menu li{ line-height: 1.2; padding: 8px 0; } #footer.simple .menu li a{ font-size: 14px; line-height: 1.2; } #footer.simple .menu .menu-item > a{ padding: 8px 0; } #footer.simple .menu .sub-menu{ margin-left: 0; padding: 8px 0; } #footer.simple .menu .sub-menu li{ margin-left: 0; } #footer.simple .menu .sub-menu li::before{ content: "―"; display: inline-block; margin-right: 2px; overflow: hidden; vertical-align: top; width: 6px; } @media (max-width: 370px){#footer.simple .sidebar-item{ width: 50%; }} #footer.simple .sidebar-item li a[href="#"]{ color: #787e8a; cursor: default; pointer-events: none; } #footer.simple .sidebar-item:nth-of-type(3){ float: right; } #footer.simple .sidebar-item:last-child:nth-child(2n + 1){ margin-left: 0; } #footer.simple .sidebar-item[class*="widget_"] a{ color: #4b5363; } #footer.simple .sidebar-item[class*="widget_"] a span{ color: #787e8a; } #footer.simple .sidebar-item[class*="widget_"] a:hover{ color: #2d5dea; } #footer.simple .sidebar-item[class*="widget_"] a:hover span{ color: #2d5dea; } #footer.simple .sidebar-item.widget_nav_menu .item-wrap{ max-width: none; text-align: left; } #footer.simple .sidebar-item.widget_nav_menu .item-wrap h5{ color: #1e3c8c; font-size: 18px; font-weight: bold; margin-bottom: 20px; } #footer.simple .footer-bottom-wrap{ padding: 16px 0 20px; } #footer.simple .footer-bottom-wrap > .container{ padding: 0; } @media (max-width: 767px){#footer.simple .footer-bottom-col:not(:last-child){ margin-bottom: 0; }} @media (max-width: 767px){.footer-bottom-container{ -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; margin: 0; }} .footer-bottom-container .footer-bottom-nav{ color: #d2d4d8; font-size: 14px; padding: 0; white-space: nowrap; } @media (max-width: 767px){.footer-bottom-container .footer-bottom-nav{ line-height: 40px; white-space: normal; }} .footer-bottom-container .footer-bottom-nav a{ color: #4b5363; white-space: nowrap; } .footer-bottom-container .footer-bottom-nav a:hover{ color: #2d5dea; } .footer-bottom-container .footer-bottom-nav a:first-child{ margin-left: 15px; } .footer-bottom-container .footer-bottom-nav a:nth-child(3){ margin-right: 15px; } .footer-bottom-container .footer-bottom-nav .fa-facebook-official{ color: #4b5363; font-size: 0; margin: 0 8px 0 15px; } .footer-bottom-container .footer-bottom-nav .fa-facebook-official:before{ font-size: 20px; } .footer-bottom-container .footer-bottom-nav .bi-twitter-x{ color: #4b5363; font-size: 0; margin: 0 15px 0 0; } .footer-bottom-container .footer-bottom-nav .bi-twitter-x:before{ font-size: 16px; } .row-has-sidebar{ display: -webkit-box; display: -ms-flexbox; display: flex; } @media (max-width: 991px){.row-has-sidebar{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }} .row-has-sidebar .sidebar{ -ms-flex-negative: 0; flex-shrink: 0; margin-top: 15px; } @media (max-width: 991px){.row-has-sidebar .sidebar{ margin-top: 60px; }} @media (max-width: 767px){.row-has-sidebar .sidebar{ padding: 0; }} .single-news-container .row-has-sidebar .sidebar{ margin-top: 0; } @media (max-width: 991px){.single-news-container .row-has-sidebar .sidebar{ margin-top: 60px; }} @media (max-width: 991px){.main-wrapper .col-md-3 .sidebar .sidebar-item,.main-wrapper .col-md-3 .sidebar-item{ margin-bottom: 30px; }} .main-wrapper .col-md-3 .sidebar .sidebar-item > h5,.main-wrapper .col-md-3 .sidebar-item > h5{ border-bottom: 0; color: #1e283c; font-size: 16px; font-weight: 700; line-height: 1.88; margin-bottom: 24px; text-align: left; } @media (max-width: 991px){.main-wrapper .col-md-3 .sidebar .sidebar-item > h5,.main-wrapper .col-md-3 .sidebar-item > h5{ font-size: 18px; }} .main-wrapper .col-md-3 .sidebar .sidebar-item > h5::after,.main-wrapper .col-md-3 .sidebar-item > h5::after{ border-bottom: 3px solid #1e3c8c; content: ""; display: block; margin-top: 8px; width: 36px; } .main-wrapper .col-md-3 .sidebar .sidebar-item > ul,.main-wrapper .col-md-3 .sidebar-item > ul{ margin-bottom: 4px; } .main-wrapper .col-md-3 .sidebar .sidebar-item > ul > li,.main-wrapper .col-md-3 .sidebar-item > ul > li{ color: #787e8a; font-size: 14px; line-height: 20px; padding: 10px 0 !important; } @media (max-width: 991px){.main-wrapper .col-md-3 .sidebar .sidebar-item > ul > li,.main-wrapper .col-md-3 .sidebar-item > ul > li{ font-size: 16px; }} .main-wrapper .col-md-3 .sidebar .sidebar-item > ul > li + li,.main-wrapper .col-md-3 .sidebar-item > ul > li + li{ border-top: 1px solid #e8e9eb; } .main-wrapper .col-md-3 .sidebar .sidebar-item > ul > li a,.main-wrapper .col-md-3 .sidebar-item > ul > li a{ color: inherit; font-size: inherit !important; } .main-wrapper .col-md-3 .sidebar .sidebar-item > ul > li a:hover,.main-wrapper .col-md-3 .sidebar-item > ul > li a:hover{ color: #1e3c8c !important; } .main-wrapper .col-md-3 .sidebar .sidebar-item p,.main-wrapper .col-md-3 .sidebar-item p{ font-size: 14px !important; } .main-wrapper .col-md-3 .sidebar .sidebar-item a,.main-wrapper .col-md-3 .sidebar-item a{ color: #00bcd4; font-size: 14px !important; } .main-wrapper .col-md-3 .sidebar .sidebar-item a:hover,.main-wrapper .col-md-3 .sidebar-item a:hover{ color: #2d5dea !important; } .main-wrapper .col-md-3 .sidebar .sidebar-item a.btn-detail,.main-wrapper .col-md-3 .sidebar-item a.btn-detail{ background-color: #00bcd4; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #00bcd4)); background-image: linear-gradient(to right, transparent 50%, #00bcd4 50%); background-size: 200% 100%; background-position: right center; display: block; margin: 0 auto; text-align: center; color: #ffffff; font-weight: 500; font-size: 14px; padding: 6px; width: 80%; border: 1px solid #00bcd4; border-radius: 30px; } .main-wrapper .col-md-3 .sidebar .sidebar-item a.btn-detail:hover,.main-wrapper .col-md-3 .sidebar-item a.btn-detail:hover{ background-color: transparent; background-position: left center; } .main-wrapper .col-md-3 .sidebar .sidebar-item a.btn-detail:hover,.main-wrapper .col-md-3 .sidebar-item a.btn-detail:hover{ color: #00bcd4 !important; } .main-wrapper .col-md-3 .sidebar .sidebar-item .seminar-list a:hover,.main-wrapper .col-md-3 .sidebar-item .seminar-list a:hover{ opacity: 0.7; } .main-wrapper .col-md-3 .sidebar .sidebar-item.widget_tag_cloud .tagcloud a.tag-cloud-link,.main-wrapper .col-md-3 .sidebar-item.widget_tag_cloud .tagcloud a.tag-cloud-link{ background-color: transparent; color: #1e3c8c; font-weight: 500; font-size: 12px; padding: 0; margin: 0 10px 10px 0; } .main-wrapper .col-md-3 .sidebar .sidebar-item.widget_tag_cloud .tagcloud a.tag-cloud-link .tag-link-count,.main-wrapper .col-md-3 .sidebar-item.widget_tag_cloud .tagcloud a.tag-cloud-link .tag-link-count{ color: #787e8a; font-size: 12px !important; } .category-archive{ background-color: #f4f6fA; } .category-archive .category-post-list-outer{ -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .padding-both .archive-container{ padding-bottom: 40px !important; } @media (max-width: 767px){.padding-both .archive-container{ padding-bottom: 20px !important; }} .post-list{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; } .page .post-list{ margin: 0; } .post-list > li{ display: -webkit-box; display: -ms-flexbox; display: flex; margin: 0; padding: 15px; } @media (min-width: 640px){.post-list > li{ width: 50%; }} @media (min-width: 960px){.post-list > li{ width: calc(100% / 3); }} @media (max-width: 767px){.post-list.category{ padding: 25px 10px 0; }} @media (min-width: 576px){.post-list.category > li{ width: 50%; }} .post-list.seminar{ background-color: transparent; } @media (max-width: 767px){.post-list.seminar{ padding: 25px 10px 0; }} @media (min-width: 768px){.post-list.seminar > li{ width: 50%; }} @media (min-width: 992px){.post-list.seminar > li{ width: calc(100% / 3); }} .post-list .card{ background: #fff; -webkit-box-shadow: 0 3px 6px 0 rgba(30, 60, 140, 0.2); box-shadow: 0 3px 6px 0 rgba(30, 60, 140, 0.2); display: -webkit-box; display: -ms-flexbox; display: flex; } .post-list .card > a{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .post-list .card > a:hover .post-thumbnail{ -webkit-transform: translateY(-9px); transform: translateY(-9px); } .post-list .card .post-thumbnail{ margin-bottom: -10px; text-align: center; -webkit-transition: -webkit-transform 0.25s ease-in-out; transition: -webkit-transform 0.25s ease-in-out; transition: transform 0.25s ease-in-out; transition: transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out; } .post-list .card .card-body{ background: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding: 16px; position: relative; } @media (min-width: 768px){.post-list .card .card-body{ padding: 16px; }} .post-list .card .card-footer{ border-top: 1px solid #e8e9eb; padding: 12px 16px; } .post-list .card .post-meta{ margin-bottom: 12px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .post-list .card .cat{ font-size: 12px; line-height: 18px; margin-right: 12px; padding: 2px 12px; -ms-flex-negative: 0; flex-shrink: 0; } @media (max-width: 991px){.post-list .card .cat{ font-size: 12px; line-height: 16px; }} .post-list .card .post-date{ color: #787e8a; font-size: 14px; line-height: 18px; } @media (max-width: 991px){.post-list .card .post-date{ font-size: 14px; line-height: 16px; }} .post-list .card .post-title{ color: #1e283c; font-size: 16px; line-height: 1.5; margin: 0; } .post-list .card .post-client{ color: #787e8a; font-weight: 700; font-size: 14px; margin-bottom: 6px; } .post-list .card .post-client-items{ color: #787e8a; font-size: 12px; margin-bottom: 6px; } .post-list .card ul.post-client-type{ color: #ffffff; font-size: 12px; margin: 0; } .post-list .card ul.post-client-type li{ display: inline-block; padding: 4px 8px; margin: 0 4px 4px 0; } .post-list .card ul.post-client-type li.retail{ background: #2d5dea; } .post-list .card ul.post-client-type li.wholesale{ background: #009688; } .post-list .card ul.post-client-type li.store{ background: #5aaa3c; } .post-list .card ul.post-client-type li.ec{ background: #00bcd4; } .post-list .card ul.post-client-type li.outlet{ background: #ba68c8; } .post-list .card .post-client-category{ color: #1e283c; font-size: 12px; line-height: 1; } .post-list .card .post-client-category div{ color: #ffffff; background-color: #2d5dea; display: inline-block; font-size: 10px; padding: 4px 6px 2px; margin: 0 4px 0 0; } .cat{ background: #a5a9b1; color: #fff; } .cat.events-seminar{ background: #1e3c8c; } .cat.events-exhibition{ background: #00bcd4; } .cat.events-extra{ background: #00bcd4; } .cat.media{ margin-top: 0; background: #1e3c8c; } .cat.releases{ background: #2d5dea; } .post-paper{ background: none; } .single-post .main-wrapper{ background: #f4f6fA; } .single-post .main-wrapper .container:not(.cta-row){ padding-bottom: 60px !important; } @media (max-width: 767px){.single-post .main-wrapper .container:not(.cta-row){ padding: 46px 15px 30px !important; }} .single-post .main-wrapper .container:not(.cta-row) .col-xs-12 > h2:first-child{ margin-top: 20px; } .single-post .post-paper{ text-align: left; } .single-post .post-paper h2{ color: #1e3c8c; font-size: 32px; line-height: 1.5; margin: 2em auto; } @media (max-width: 991px){.single-post .post-paper h2{ font-size: 24px; }} .single-post .post-paper h2::after{ content: ""; display: block; margin: 18px auto 0; width: 60px; height: 4px; border-radius: 3px; background-color: #1e3c8c; opacity: 0.2; } @media (min-width: 768px){.single-post .post-paper h2::after{ height: 6px; }} .single-post .post-paper h3{ color: #1e3c8c; font-size: 20px; line-height: 1.6; margin: 64px 0 32px; } .single-post .post-paper h4{ color: #1e283c; font-size: 18px; line-height: 2; margin: 2em 0 0; } .single-post .post-paper ul,.single-post .post-paper ol,.single-post .post-paper p{ color: #4b5363; line-height: 2; margin-bottom: 2em; } .single-post .post-paper ul li,.single-post .post-paper ol li{ color: #4b5363; } .single-post hr.wp-block-separator{ border: none; border-bottom: 1px solid #e8e9eb; } @media (max-width: 767px){.single-post .single-news-container{ padding: 50px 15px !important; }} @media (min-width: 992px){.single-post .single-news-container .post-details{ margin: 0 auto; }} @media (max-width: 767px){.single-post .single-news-container .post-details .single-content{ padding-left: 0; padding-right: 0; }} .single-case .row,.single-success .row,.single-news-container .row{ padding: 0 10px; } @media (max-width: 767px){.single-case .row,.single-success .row,.single-news-container .row{ padding: 0; }} .single-case .row .post-details,.single-success .row .post-details,.single-news-container .row .post-details{ padding: 0 15px; } @media (max-width: 767px){.single-case .row .post-details,.single-success .row .post-details,.single-news-container .row .post-details{ padding: 0; }} .single-case .single-content,.single-success .single-content,.single-news-container .single-content{ background: none; } @media (max-width: 991px){.single-case .single-content,.single-success .single-content,.single-news-container .single-content{ margin-top: 0; }} .single-case .post-paper,.single-success .post-paper,.single-news-container .post-paper{ background: #fff; color: #4b5363; font-size: 16px; line-height: 2; margin: 0 auto; max-width: 850px; padding: 40px; } @media (max-width: 991px){.single-case .post-paper,.single-success .post-paper,.single-news-container .post-paper{ padding: 25px; }} @media (max-width: 767px){.single-case .post-paper,.single-success .post-paper,.single-news-container .post-paper{ margin-top: 0; }} .single-case .post-paper h2,.single-success .post-paper h2,.single-news-container .post-paper h2{ color: #1e283c; font-size: 24px; line-height: 1.5; margin: 40px 0 20px; } @media (max-width: 991px){.single-case .post-paper h2,.single-success .post-paper h2,.single-news-container .post-paper h2{ font-size: 20px; margin: 30px 0 20px; }} .single-case .post-paper h2::after,.single-success .post-paper h2::after,.single-news-container .post-paper h2::after{ content: none; } .single-case .post-paper h2.gray,.single-success .post-paper h2.gray,.single-news-container .post-paper h2.gray{ color: #ffffff; background-color: #787e8a; padding: 12px 0; border-radius: 4px; text-align: center; } .single-case .post-paper h2.navy,.single-success .post-paper h2.navy,.single-news-container .post-paper h2.navy{ color: #ffffff; background-color: #1e3c8c; padding: 12px 0; border-radius: 4px; text-align: center; } .single-case .post-paper h2.viridian,.single-success .post-paper h2.viridian,.single-news-container .post-paper h2.viridian{ color: #ffffff; background-color: #009688; padding: 12px 0; border-radius: 4px; text-align: center; } .single-case .post-paper h3,.single-success .post-paper h3,.single-news-container .post-paper h3{ color: #1e283c; font-size: 20px; line-height: 1.75; margin: 40px 0 20px; } @media (max-width: 991px){.single-case .post-paper h3,.single-success .post-paper h3,.single-news-container .post-paper h3{ font-size: 18px; line-height: 1.5; margin: 30px 0 20px; }} .single-case .post-paper h3.navy,.single-success .post-paper h3.navy,.single-news-container .post-paper h3.navy{ color: #1e3c8c; } .single-case .post-paper h3.summary,.single-success .post-paper h3.summary,.single-news-container .post-paper h3.summary{ color: #1E82E6; background-color: rgba(30, 130, 230, 0.1); font-size: 16px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 2px 8px; border-radius: 4px; margin: 0 0 12px; } @media (min-width: 992px){.single-case .post-paper h3.summary,.single-success .post-paper h3.summary,.single-news-container .post-paper h3.summary{ font-size: 16px; padding: 4px 12px; margin: 0 0 16px; }} .single-case .post-paper ul,.single-case .post-paper ol,.single-case .post-paper p,.single-success .post-paper ul,.single-success .post-paper ol,.single-success .post-paper p,.single-news-container .post-paper ul,.single-news-container .post-paper ol,.single-news-container .post-paper p{ color: #4b5363; font-size: 16px; margin-bottom: 2em; } @media (max-width: 991px){.single-case .post-paper ul,.single-case .post-paper ol,.single-case .post-paper p,.single-success .post-paper ul,.single-success .post-paper ol,.single-success .post-paper p,.single-news-container .post-paper ul,.single-news-container .post-paper ol,.single-news-container .post-paper p{ font-size: 15px; line-height: 2; }} .single-case .post-paper ul:last-child,.single-case .post-paper ol:last-child,.single-case .post-paper p:last-child,.single-success .post-paper ul:last-child,.single-success .post-paper ol:last-child,.single-success .post-paper p:last-child,.single-news-container .post-paper ul:last-child,.single-news-container .post-paper ol:last-child,.single-news-container .post-paper p:last-child{ margin-bottom: 0; } .single-case .post-paper ul li,.single-case .post-paper ol li,.single-success .post-paper ul li,.single-success .post-paper ol li,.single-news-container .post-paper ul li,.single-news-container .post-paper ol li{ color: #4b5363; font-size: 15px; line-height: 1.5; } @media (min-width: 992px){.single-case .post-paper ul li,.single-case .post-paper ol li,.single-success .post-paper ul li,.single-success .post-paper ol li,.single-news-container .post-paper ul li,.single-news-container .post-paper ol li{ font-size: 16px; }} .single-case .post-paper figure,.single-success .post-paper figure,.single-news-container .post-paper figure{ margin-bottom: 32px; } .single-case .post-paper figcaption,.single-success .post-paper figcaption,.single-news-container .post-paper figcaption{ color: #787e8a; font-size: 14px; margin-top: 10px; } .single-case .post-paper blockquote,.single-success .post-paper blockquote,.single-news-container .post-paper blockquote{ background-color: #f4f6fA; padding: 10px 24px 20px; margin: 40px 0; } @media (min-width: 768px){.single-case .post-paper blockquote,.single-success .post-paper blockquote,.single-news-container .post-paper blockquote{ padding: 10px 40px 30px; margin: 30px 0; }} .single-case .post-paper blockquote p,.single-success .post-paper blockquote p,.single-news-container .post-paper blockquote p{ font-size: 18px; line-height: 1.8; font-weight: 400; color: #1e283c; text-align: left; margin: 0; } .single-case .post-paper blockquote p::before,.single-success .post-paper blockquote p::before,.single-news-container .post-paper blockquote p::before{ display: block; margin-left: 0px; margin-bottom: 0px; color: #1e3c8c; font-family: "Ionicons", sans-serif; font-size: 40px; content: "\f347"; opacity: 0.2; } @media (min-width: 768px){.single-case .post-paper blockquote p::before,.single-success .post-paper blockquote p::before,.single-news-container .post-paper blockquote p::before{ margin-left: -10px; }} .single-case .post-paper blockquote cite,.single-success .post-paper blockquote cite,.single-news-container .post-paper blockquote cite{ text-align: right; color: #787e8a; font-size: 15px; } .single-case .main-top-content,.single-success .main-top-content,.single-news-container .main-top-content{ border-bottom: 1px solid #e8e9eb; margin: 0px -40px 40px; padding: 0px 40px; } @media (max-width: 991px){.single-case .main-top-content,.single-success .main-top-content,.single-news-container .main-top-content{ margin: 0px -25px 20px; padding: 0px 25px; }} .single-case .main-top-content .client,.single-success .main-top-content .client,.single-news-container .main-top-content .client{ color: #787e8a; font-weight: 700; font-size: 16px; line-height: 1.5; margin-bottom: 8px; } @media (min-width: 768px){.single-case .main-top-content .client,.single-success .main-top-content .client,.single-news-container .main-top-content .client{ font-size: 18px; }} @media (min-width: 992px){.single-case .main-top-content .client,.single-success .main-top-content .client,.single-news-container .main-top-content .client{ font-size: 20px; }} @media (min-width: 768px){.single-case .main-top-content .client-meta,.single-success .main-top-content .client-meta,.single-news-container .main-top-content .client-meta{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }} .single-case .main-top-content .client-items,.single-success .main-top-content .client-items,.single-news-container .main-top-content .client-items{ color: #787e8a; font-size: 14px; margin-bottom: 6px; } @media (min-width: 768px){.single-case .main-top-content .client-items,.single-success .main-top-content .client-items,.single-news-container .main-top-content .client-items{ font-size: 16px; margin-bottom: 8px; }} .single-case .main-top-content .client-type,.single-success .main-top-content .client-type,.single-news-container .main-top-content .client-type{ color: #ffffff; font-size: 12px; line-height: 1em; margin-bottom: 12px; } @media (min-width: 768px){.single-case .main-top-content .client-type,.single-success .main-top-content .client-type,.single-news-container .main-top-content .client-type{ font-size: 14px; margin-bottom: 8px; }} .single-case .main-top-content .client-type div,.single-success .main-top-content .client-type div,.single-news-container .main-top-content .client-type div{ display: inline-block; padding: 4px 8px; margin: 0 4px 4px 0; } @media (min-width: 768px){.single-case .main-top-content .client-type div,.single-success .main-top-content .client-type div,.single-news-container .main-top-content .client-type div{ padding: 6px 12px; }} .single-case .main-top-content .client-type div:last-child,.single-success .main-top-content .client-type div:last-child,.single-news-container .main-top-content .client-type div:last-child{ margin: 0 0 4px 0; } .single-case .main-top-content .client-type div.retail,.single-success .main-top-content .client-type div.retail,.single-news-container .main-top-content .client-type div.retail{ background: #2d5dea; } .single-case .main-top-content .client-type div.wholesale,.single-success .main-top-content .client-type div.wholesale,.single-news-container .main-top-content .client-type div.wholesale{ background: #009688; } .single-case .main-top-content .client-type div.store,.single-success .main-top-content .client-type div.store,.single-news-container .main-top-content .client-type div.store{ background: #5aaa3c; } .single-case .main-top-content .client-type div.ec,.single-success .main-top-content .client-type div.ec,.single-news-container .main-top-content .client-type div.ec{ background: #00bcd4; } .single-case .main-top-content .client-type div.outlet,.single-success .main-top-content .client-type div.outlet,.single-news-container .main-top-content .client-type div.outlet{ background: #ba68c8; } .single-case .main-top-content .product-type,.single-success .main-top-content .product-type,.single-news-container .main-top-content .product-type{ border-top: 1px solid #e8e9eb; padding: 12px 16px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 12px 24px; } .single-case .main-top-content .product-type img,.single-success .main-top-content .product-type img,.single-news-container .main-top-content .product-type img{ display: block; width: 160px; } @media (min-width: 768px){.single-case .main-top-content .product-type img,.single-success .main-top-content .product-type img,.single-news-container .main-top-content .product-type img{ width: 180px; }} @media (min-width: 992px){.single-case .main-top-content .product-type img,.single-success .main-top-content .product-type img,.single-news-container .main-top-content .product-type img{ width: 220px; }} @media (min-width: 1200px){.single-case .main-top-content .product-type img,.single-success .main-top-content .product-type img,.single-news-container .main-top-content .product-type img{ width: 220px; }} .single-case .main-top-content .client-category,.single-success .main-top-content .client-category,.single-news-container .main-top-content .client-category{ color: #1e283c; font-size: 12px; line-height: 1em; padding-bottom: 12px; } @media (min-width: 768px){.single-case .main-top-content .client-category,.single-success .main-top-content .client-category,.single-news-container .main-top-content .client-category{ font-size: 16px; padding-bottom: 16px; }} .single-case .main-top-content .client-category div,.single-success .main-top-content .client-category div,.single-news-container .main-top-content .client-category div{ color: #ffffff; background-color: #2d5dea; display: inline-block; font-size: 10px; padding: 2px 6px; margin: 0 6px 0 0; } @media (min-width: 768px){.single-case .main-top-content .client-category div,.single-success .main-top-content .client-category div,.single-news-container .main-top-content .client-category div{ font-size: 14px; padding: 4px 12px; margin: 0 8px 0 0; }} .single-case .post-title,.single-success .post-title,.single-news-container .post-title{ color: #1e283c; font-size: 24px; line-height: 1.5; margin-bottom: 16px; letter-spacing: 1px; } @media (max-width: 991px){.single-case .post-title,.single-success .post-title,.single-news-container .post-title{ font-size: 22px; }} @media (max-width: 767px){.single-case .post-title,.single-success .post-title,.single-news-container .post-title{ font-size: 20px; }} .single-case .post-meta,.single-success .post-meta,.single-news-container .post-meta{ margin-bottom: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 991px){.single-case .post-meta,.single-success .post-meta,.single-news-container .post-meta{ margin-bottom: 10px; }} .single-case .category-label,.single-success .category-label,.single-news-container .category-label{ background: #a5a9b1; color: #fff; font-size: 14px; line-height: 20px; margin-right: 12px; padding: 2px 12px; -ms-flex-negative: 0; flex-shrink: 0; } @media (max-width: 991px){.single-case .category-label,.single-success .category-label,.single-news-container .category-label{ font-size: 14px; line-height: 18px; }} .single-case .post-date,.single-success .post-date,.single-news-container .post-date{ color: #787e8a; font-size: 16px; line-height: 20px; } @media (max-width: 991px){.single-case .post-date,.single-success .post-date,.single-news-container .post-date{ font-size: 14px; line-height: 18px; }} .single-case .post-banner,.single-success .post-banner,.single-news-container .post-banner{ min-height: auto; margin: 20px 0; } .wp-block-embed-twitter{ width: 100%; margin: 30px auto; } @media (min-width: 768px){.wp-block-embed-twitter{ width: 500px; margin: 40px auto; }} iframe.note-embed{ width: 100%; margin: 30px auto; } @media (min-width: 768px){iframe.note-embed{ width: 500px; margin: 40px auto; }} .btn-inquiry{ margin: 30px auto; } @media (min-width: 768px){.btn-inquiry{ margin: 40px auto; }} .btn-inquiry a{ background-color: #1e3c8c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #1e3c8c)); background-image: linear-gradient(to right, transparent 50%, #1e3c8c 50%); background-size: 200% 100%; background-position: right center; -webkit-appearance: none; -moz-appearance: none; appearance: none; color: #fff; border: 2px solid #1e3c8c; display: block; font-size: 16px; font-weight: bold; line-height: 1 !important; margin: 0 auto; padding: 12px 24px; width: 40%; min-width: 240px; border-radius: 60px; text-align: center; } .btn-inquiry a:hover{ background-color: transparent; background-position: left center; } @media (min-width: 768px){.btn-inquiry a{ font-size: 18px; padding: 18px 36px; }} .btn-inquiry a:hover{ color: #1e3c8c; } .btn-wp00{ margin: 30px auto; } @media (min-width: 768px){.btn-wp00{ margin: 40px auto; }} .btn-wp00 a{ background-color: #00bcd4; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #00bcd4)); background-image: linear-gradient(to right, transparent 50%, #00bcd4 50%); background-size: 200% 100%; background-position: right center; -webkit-appearance: none; -moz-appearance: none; appearance: none; color: #fff; border: 1px solid #00bcd4; display: block; font-size: 16px; font-weight: bold; line-height: 1.25 !important; margin: 0 auto; padding: 12px 24px; width: 60%; min-width: 240px; border-radius: 60px; text-align: center; } .btn-wp00 a:hover{ background-color: transparent; background-position: left center; } @media (min-width: 768px){.btn-wp00 a{ font-size: 20px; padding: 18px 36px; }} .btn-wp00 a:hover{ color: #00bcd4; } .archive .main-wrapper,.page .main-wrapper,.single .main-wrapper{ background: #f4f6fA; } .archive .post-little-banner,.page .post-little-banner,.single .post-little-banner{ background-color: #1e3c8c; background-image: url("/assets/images/header-bg.jpg"); background-position: left 10% top 20%; background-repeat: no-repeat; background-size: cover; margin-bottom: 0; padding: 60px 0 30px; } @media (min-width: 992px){.archive .post-little-banner,.page .post-little-banner,.single .post-little-banner{ padding: 120px 0 40px; background-position: center center; }} .archive .post-little-banner.DB,.page .post-little-banner.DB,.single .post-little-banner.DB{ background-image: url("/assets/images/DB-header-bg.jpg"); } .archive .post-little-banner .page-title-blog,.page .post-little-banner .page-title-blog,.single .post-little-banner .page-title-blog{ color: #fff; font-size: 40px; line-height: 1.5; margin-top: 0; padding-left: 35px; padding-right: 35px; letter-spacing: 2px; } @media (max-width: 991px){.archive .post-little-banner .page-title-blog,.page .post-little-banner .page-title-blog,.single .post-little-banner .page-title-blog{ font-size: 32px; letter-spacing: 1px; padding-left: 10px; padding-right: 10px; }} @media (max-width: 767px){.archive .post-little-banner .page-title-blog,.page .post-little-banner .page-title-blog,.single .post-little-banner .page-title-blog{ font-size: 24px; letter-spacing: 1px; padding-left: 10px; padding-right: 10px; }} .archive .post-little-banner .page-title-blog span,.page .post-little-banner .page-title-blog span,.single .post-little-banner .page-title-blog span{ color: #ffffff; font-size: 16px; } @media (min-width: 768px){.archive .post-little-banner .page-title-blog span,.page .post-little-banner .page-title-blog span,.single .post-little-banner .page-title-blog span{ font-size: 18px; }} @media (min-width: 992px){.archive .post-little-banner .page-title-blog span,.page .post-little-banner .page-title-blog span,.single .post-little-banner .page-title-blog span{ font-size: 20px; }} @media (min-width: 1200px){.archive .post-little-banner .page-title-blog span,.page .post-little-banner .page-title-blog span,.single .post-little-banner .page-title-blog span{ font-size: 24px; }} .archive .post-little-banner .post-paper.no-vc,.page .post-little-banner .post-paper.no-vc,.single .post-little-banner .post-paper.no-vc{ background: none; } .archive .post-little-banner .post-paper.no-vc > .container,.page .post-little-banner .post-paper.no-vc > .container,.single .post-little-banner .post-paper.no-vc > .container{ width: 1000px; } .feature-page .main-wrapper,.year2030-page .main-wrapper{ background: #f4f6fA; } .feature-page .page-banner .page-title,.year2030-page .page-banner .page-title{ color: #fff; font-size: 48px; font-weight: 700; line-height: 1.35; margin-top: 0; padding-left: 35px; padding-right: 35px; letter-spacing: 2px; } @media (max-width: 767px){.feature-page .page-banner .page-title,.year2030-page .page-banner .page-title{ font-size: 24px; line-height: 1.5; letter-spacing: 1px; padding-left: 10px; padding-right: 10px; }} .feature-page .page-banner .page-title::after,.year2030-page .page-banner .page-title::after{ content: ""; display: block; margin: 12px auto 0; width: 40px; height: 4px; border-radius: 3px; background-color: #fff; opacity: 0.2; } @media (min-width: 768px){.feature-page .page-banner .page-title::after,.year2030-page .page-banner .page-title::after{ width: 60px; margin: 16px auto 0; height: 6px; }} .fixed-page h2,.feature-page h2{ color: #1e3c8c; font-size: 24px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.fixed-page h2,.feature-page h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 48px; }} .fixed-page h2::after,.feature-page h2::after{ content: ""; display: block; margin: 12px auto 0; width: 40px; height: 4px; border-radius: 3px; background-color: #1e3c8c; opacity: 0.2; } @media (min-width: 768px){.fixed-page h2::after,.feature-page h2::after{ width: 60px; margin: 16px auto 0; height: 6px; }} .fixed-page p,.fixed-page p.lead,.feature-page p,.feature-page p.lead{ font-size: 16px; font-weight: 400; line-height: 2; color: #4b5363; margin: 0; } .post-details ul li:first-of-type,.post-details ol li:first-of-type{ margin-top: 10px; } .post-details ul li,.post-details ol li{ margin-bottom: 10px; font-size: 16px; } .single-case .post-paper figure.wp-block-image,.single-success .post-paper figure.wp-block-image,.single-news-container .post-paper figure.wp-block-image{ text-align: center; } @media screen and (max-width: 767px){.post-details ul li,.post-details ol li{ margin-bottom: 5px; font-size: 16px; line-height: 1.5; }} .single-news-container{ padding-top: 60px; padding-bottom: 100px; } @media (min-width: 768px){.single-news-container{ padding-top: 72px; }} @media (min-width: 992px){.single-news-container{ padding-top: 92px; }} @media (min-width: 1200px){.single-news-container{ padding-top: 100px; }} .single-post .header_trans-fixed.header_top_bg:not(.bg-fixed-color){ background-color: #1e3c8c !important; } .single-case .main-wrapper{ background: #f4f6fA; } .single-case .main-wrapper .CTA-function{ background-image: url("/assets/images/CTA-bg.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover; color: #fff; padding: 60px 0 20px; position: relative; } @media (min-width: 992px){.single-case .main-wrapper .CTA-function{ padding: 100px 0 30px; }} .single-case .main-wrapper .CTA-function .cta-link{ text-align: center; } .single-case .main-wrapper .CTA-function .cta-link a{ background-color: #00bcd4; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #00bcd4)); background-image: linear-gradient(to right, #fff 50%, #00bcd4 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #00bcd4; color: #fff; display: inline-block; font-size: 14px; font-weight: bold; line-height: 1; padding: 12px 0px; white-space: nowrap; border-radius: 40px; width: 240px; text-align: center; vertical-align: bottom; } .single-case .main-wrapper .CTA-function .cta-link a:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.single-case .main-wrapper .CTA-function .cta-link a{ font-size: 18px; padding: 18px 24px 20px; width: 320px; max-width: 100%; margin: 0; }} @media (min-width: 1200px){.single-case .main-wrapper .CTA-function .cta-link a{ font-size: 20px; width: 400px; padding: 20px 32px 22px; }} .single-case .main-wrapper .CTA-function .cta-link a:hover{ color: #00bcd4; } .single-case .main-wrapper .CTA-function .cta-link a i{ font-size: 20px; margin-right: 8px; } @media screen and (min-width: 768px){.single-case .main-wrapper .CTA-function .cta-link a i{ font-size: 22px; margin-right: 8px; }} @media screen and (min-width: 1200px){.single-case .main-wrapper .CTA-function .cta-link a i{ font-size: 24px; margin-right: 8px; }} .single-case .main-wrapper .CTA-function .cta-link a.inquiry{ background-color: transparent; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #ffffff), color-stop(50%, transparent)); background-image: linear-gradient(to right, #ffffff 50%, transparent 50%); background-size: 200% 100%; background-position: right center; color: #fff; border: 1px solid #fff; margin: 0; } .single-case .main-wrapper .CTA-function .cta-link a.inquiry:hover{ background-color: #ffffff; background-position: left center; } .single-case .main-wrapper .CTA-function .cta-link a.inquiry:hover{ color: #1e3c8c; } .single-case .main-wrapper .single-content{ padding-bottom: 30px; } @media (min-width: 768px){.single-case .main-wrapper .single-content{ padding-bottom: 60px; }} .single-case .header_top_bg.header_trans-fixed + .container{ padding-top: 88px; padding-bottom: 100px; } @media (max-width: 991px){.single-case .header_top_bg.header_trans-fixed + .container{ padding-top: 50px; }} .single-case .header_top_bg.header_trans-fixed + .container::before{ background: #1e3c8c; content: ""; display: block; height: 88px; left: 0; position: fixed; top: 0; width: 100%; z-index: 2; } @media (max-width: 991px){.single-case .header_top_bg.header_trans-fixed + .container::before{ height: 50px; }} .single-success .main-wrapper{ background: #f4f6fA; } .single-success .main-wrapper .CTA-function{ background-image: url("/assets/images/CTA-bg.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover; color: #fff; padding: 60px 0 20px; position: relative; } @media (min-width: 992px){.single-success .main-wrapper .CTA-function{ padding: 100px 0 30px; }} .single-success .main-wrapper .CTA-function .cta-link{ text-align: center; } .single-success .main-wrapper .CTA-function .cta-link a{ background-color: #00bcd4; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #00bcd4)); background-image: linear-gradient(to right, #fff 50%, #00bcd4 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #00bcd4; color: #fff; display: inline-block; font-size: 14px; font-weight: bold; line-height: 1; padding: 12px 0px; white-space: nowrap; border-radius: 40px; width: 240px; text-align: center; vertical-align: bottom; } .single-success .main-wrapper .CTA-function .cta-link a:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.single-success .main-wrapper .CTA-function .cta-link a{ font-size: 18px; padding: 18px 24px 20px; width: 320px; max-width: 100%; margin: 0; }} @media (min-width: 1200px){.single-success .main-wrapper .CTA-function .cta-link a{ font-size: 20px; width: 400px; padding: 20px 32px 22px; }} .single-success .main-wrapper .CTA-function .cta-link a:hover{ color: #00bcd4; } .single-success .main-wrapper .CTA-function .cta-link a i{ font-size: 20px; margin-right: 8px; } @media screen and (min-width: 768px){.single-success .main-wrapper .CTA-function .cta-link a i{ font-size: 22px; margin-right: 8px; }} @media screen and (min-width: 1200px){.single-success .main-wrapper .CTA-function .cta-link a i{ font-size: 24px; margin-right: 8px; }} .single-success .main-wrapper .CTA-function .cta-link a.inquiry{ background-color: transparent; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #ffffff), color-stop(50%, transparent)); background-image: linear-gradient(to right, #ffffff 50%, transparent 50%); background-size: 200% 100%; background-position: right center; color: #fff; border: 1px solid #fff; margin: 0; } .single-success .main-wrapper .CTA-function .cta-link a.inquiry:hover{ background-color: #ffffff; background-position: left center; } .single-success .main-wrapper .CTA-function .cta-link a.inquiry:hover{ color: #1e3c8c; } .single-success .main-wrapper .single-content{ padding-bottom: 30px; } @media (min-width: 768px){.single-success .main-wrapper .single-content{ padding-bottom: 60px; }} .single-success .header_top_bg.header_trans-fixed + .container{ padding-top: 88px; padding-bottom: 100px; } @media (max-width: 991px){.single-success .header_top_bg.header_trans-fixed + .container{ padding-top: 50px; }} .single-success .header_top_bg.header_trans-fixed + .container::before{ background: #1e3c8c; content: ""; display: block; height: 88px; left: 0; position: fixed; top: 0; width: 100%; z-index: 2; } @media (max-width: 991px){.single-success .header_top_bg.header_trans-fixed + .container::before{ height: 50px; }} .front-page-hero{ position: relative; width: 100%; height: 100vh; min-height: 640px; overflow: hidden; background-color: #1e3c8c; color: #ffffff; } @media (min-width: 992px){.front-page-hero{ height: auto; min-height: 720px; }} @media (min-width: 1200px){.front-page-hero{ min-height: 600px; }} .front-page-hero .gradient-bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 0; opacity: 0; -webkit-animation: fph-bgFadeIn 2s ease forwards; animation: fph-bgFadeIn 2s ease forwards; } .front-page-hero .gradient-blob{ position: absolute; -webkit-filter: blur(90px); filter: blur(90px); border-radius: 50%; opacity: 0.7; -webkit-animation: fph-blobWave 25s infinite alternate ease-in-out; animation: fph-blobWave 25s infinite alternate ease-in-out; } .front-page-hero .blob-1{ top: -10%; left: -10%; width: 60vw; height: 60vw; background: #3b82f6; -webkit-animation-delay: 0s; animation-delay: 0s; } .front-page-hero .blob-2{ top: 40%; right: -20%; width: 50vw; height: 50vw; background: #60a5fa; -webkit-animation-delay: -5s; animation-delay: -5s; } .front-page-hero .blob-3{ bottom: -20%; left: 20%; width: 70vw; height: 70vw; background: #2563eb; -webkit-animation-delay: -10s; animation-delay: -10s; } .front-page-hero .blob-4{ top: 20%; left: 40%; width: 40vw; height: 40vw; background: #1d4ed8; -webkit-animation-delay: -15s; animation-delay: -15s; } .front-page-hero .canvas-container{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; opacity: 0; -webkit-animation: fph-bgFadeIn 2.5s ease 0.3s forwards; animation: fph-bgFadeIn 2.5s ease 0.3s forwards; } .front-page-hero .hero-content{ position: relative; z-index: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; pointer-events: none; padding: 80px 20px 40px; } @media (min-width: 768px){.front-page-hero .hero-content{ padding: 100px 20px 40px; }} @media (min-width: 992px){.front-page-hero .hero-content{ max-width: 880px; margin: 0 auto; padding: 120px 40px 60px; min-height: 560px; }} @media (min-width: 1200px){.front-page-hero .hero-content{ -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 0; max-width: 1200px; text-align: left; padding: 140px 40px 80px; min-height: 640px; }} .front-page-hero .hero-text{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 1200px){.front-page-hero .hero-text{ -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; }} @media (min-width: 1200px){.front-page-hero .hero-button-wrap{ -ms-flex-item-align: start; align-self: flex-start; }} .front-page-hero .hero-title{ font-size: clamp(1.25rem, 7vw, 2rem); font-weight: 700; color: #ffffff; letter-spacing: 1px; margin: 0 0 1.5rem; line-height: 1.35; text-shadow: 0 2px 12px rgba(30, 60, 140, 0.25); } @media (min-width: 768px){.front-page-hero .hero-title{ font-size: 3rem; letter-spacing: 2px; }} @media (min-width: 992px){.front-page-hero .hero-title{ font-size: 2.75rem; letter-spacing: 2px; }} @media (min-width: 1200px){.front-page-hero .hero-title{ font-size: 3rem; }} .front-page-hero .hero-description{ font-size: 0.8rem; color: #ffffff; max-width: 42rem; line-height: 1.75; margin: 0 0 2.5rem; } @media (min-width: 768px){.front-page-hero .hero-description{ font-size: 1.125rem; }} @media (min-width: 1200px){.front-page-hero .hero-description{ font-size: 1.25rem; }} .front-page-hero .hero-button{ display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 0.5rem; background-color: #ffffff; color: #1e3c8c; border: 0; padding: 0.75rem 1.5rem; border-radius: 9999px; font-weight: 600; font-size: 0.875rem; cursor: pointer; text-decoration: none; -webkit-box-shadow: 0 10px 15px -3px rgba(30, 60, 140, 0.2), 0 4px 6px -2px rgba(30, 60, 140, 0.2); box-shadow: 0 10px 15px -3px rgba(30, 60, 140, 0.2), 0 4px 6px -2px rgba(30, 60, 140, 0.2); pointer-events: auto; } @media (min-width: 768px){.front-page-hero .hero-button{ padding: 1rem 2rem; font-size: 1rem; }} .front-page-hero .hero-button:hover{ background-color: #1e283c; color: #ffffff; text-decoration: none; } .front-page-hero .hero-button svg{ -ms-flex-negative: 0; flex-shrink: 0; } .front-page-hero .hero-button i{ font-size: 1.25em; line-height: 1; } .front-page-hero .mockup-container{ margin-top: 6rem; width: 100%; max-width: 480px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; pointer-events: none; } @media (min-width: 768px){.front-page-hero .mockup-container{ margin-top: 12rem; max-width: 560px; }} @media (min-width: 992px){.front-page-hero .mockup-container{ margin-top: 3rem; max-width: 480px; }} @media (min-width: 1200px){.front-page-hero .mockup-container{ margin-top: 0; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; max-width: 540px; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }} .front-page-hero .mockup-image{ width: auto; max-width: 100%; height: auto; max-height: 50vh; -o-object-fit: contain; object-fit: contain; -o-object-position: center; object-position: center; -webkit-filter: drop-shadow(0 20px 40px rgba(30, 60, 140, 0.35)) drop-shadow(0 8px 16px rgba(30, 60, 140, 0.2)); filter: drop-shadow(0 20px 40px rgba(30, 60, 140, 0.35)) drop-shadow(0 8px 16px rgba(30, 60, 140, 0.2)); } @media (min-width: 1200px){.front-page-hero .mockup-image{ max-height: none; width: 100%; }} .front-page-hero .fade-up{ -webkit-animation: fph-fadeUp 2s cubic-bezier(0.16, 1, 0.3, 1) forwards; animation: fph-fadeUp 2s cubic-bezier(0.16, 1, 0.3, 1) forwards; opacity: 0; -webkit-transform: translateY(50px); transform: translateY(50px); -webkit-animation-delay: 1.5s; animation-delay: 1.5s; } .front-page-hero .delay-1{ -webkit-animation-delay: 1.8s; animation-delay: 1.8s; } .front-page-hero .delay-2{ -webkit-animation-delay: 2.1s; animation-delay: 2.1s; } .front-page-hero .delay-3{ -webkit-animation-delay: 2.4s; animation-delay: 2.4s; } .front-page-content ul{ list-style: none; margin: 0; } .front-page-content li{ margin: 0; } .front-page-content section h2{ color: #1e283c; font-size: 24px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.front-page-content section h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 48px; }} @media (min-width: 992px){.front-page-content section h2{ font-size: 36px; letter-spacing: 2px; margin-bottom: 60px; }} @media (min-width: 1200px){.front-page-content section h2{ font-size: 40px; letter-spacing: 3px; margin-bottom: 60px; }} .front-page-content section h2::after{ content: ""; display: block; margin: 16px auto 0; width: 40px; height: 4px; border-radius: 3px; background-color: #1e283c; opacity: 0.2; } @media (min-width: 768px){.front-page-content section h2::after{ width: 60px; margin: 20px auto 0; height: 6px; }} @media (min-width: 992px){.front-page-content section h2::after{ width: 80px; margin: 24px auto 0; height: 6px; }} .front-page-content section h3{ letter-spacing: 1px; } .front-page-content section p{ color: #4b5363; font-size: 15px; line-height: 2; margin-bottom: 2em; } @media (min-width: 768px){.front-page-content section p{ font-size: 16px; }} @media (min-width: 992px){.front-page-content section p{ font-size: 18px; }} .front-page-content section p:last-child{ margin-bottom: 0; } .front-page-content .logo-section{ background-color: #fff; padding: 10px 0; } @media screen and (min-width: 768px){.front-page-content .logo-section{ padding: 16px 0; }} @media screen and (min-width: 992px){.front-page-content .logo-section{ padding: 18px 0; }} @media screen and (min-width: 1200px){.front-page-content .logo-section{ padding: 20px 0; }} .front-page-content .logo-section .logo-inner{ margin: 0 auto; text-align: center; } @media screen and (min-width: 1200px){.front-page-content .logo-section .logo-inner{ width: 90%; }} @media screen and (min-width: 1600px){.front-page-content .logo-section .logo-inner{ width: 80%; }} @media screen and (min-width: 1920px){.front-page-content .logo-section .logo-inner{ width: 70%; }} .front-page-content .logo-section p{ text-align: center; font-size: 12px; color: #787e8a; margin-top: 10px; } @media screen and (min-width: 768px){.front-page-content .logo-section p{ margin-top: 30px; font-size: 12px; }} @media screen and (min-width: 1200px){.front-page-content .logo-section p{ font-size: 14px; }} .front-page-content .about-section{ padding-top: 30px; padding-bottom: 30px; background-color: #f4f6fA; } @media screen and (min-width: 768px){.front-page-content .about-section{ padding-top: calc(9.76562vw + -45px); }} @media screen and (min-width: 1280px){.front-page-content .about-section{ padding-top: 80px; }} @media screen and (min-width: 768px){.front-page-content .about-section{ padding-bottom: calc(13.67188vw + -75px); }} @media screen and (min-width: 1280px){.front-page-content .about-section{ padding-bottom: 100px; }} .front-page-content .about-section h2{ color: #1e3c8c; } .front-page-content .about-section .lead{ color: #1e283c; font-size: 16px; font-weight: 400; line-height: 1.8; margin-bottom: 30px; } @media (min-width: 768px){.front-page-content .about-section .lead{ text-align: center; font-size: 18px; }} @media (min-width: 992px){.front-page-content .about-section .lead{ font-size: 20px; margin-bottom: 60px; }} .front-page-content .about-section .pic{ text-align: center; } .front-page-content .about-section .pic img{ width: 90%; } @media (min-width: 768px){.front-page-content .about-section .pic img{ width: 100%; }} .front-page-content .about-section a.CTA-btn{ display: block; color: #ffffff; text-align: center; font-weight: 700; background-color: #1e3c8c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #1e3c8c)); background-image: linear-gradient(to right, transparent 50%, #1e3c8c 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #1e3c8c; font-size: 14px; line-height: 1.2; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 10px 28px; border-radius: 60px; margin: 40px auto 0; } .front-page-content .about-section a.CTA-btn:hover{ background-color: transparent; background-position: left center; } .front-page-content .about-section a.CTA-btn:hover{ color: #1e3c8c; } @media (min-width: 768px){.front-page-content .about-section a.CTA-btn{ font-size: 16px; padding: 12px 36px; }} @media (min-width: 992px){.front-page-content .about-section a.CTA-btn{ margin: 60px auto 0; font-size: 18px; padding: 14px 44px; }} @media (min-width: 1200px){.front-page-content .about-section a.CTA-btn{ font-size: 20px; padding: 16px 52px; }} .front-page-content .clients-section{ padding-top: 60px; padding-bottom: 30px; background-color: #ffffff; } @media screen and (min-width: 768px){.front-page-content .clients-section{ padding-top: calc(11.71875vw + -30px); }} @media screen and (min-width: 1280px){.front-page-content .clients-section{ padding-top: 120px; }} @media screen and (min-width: 768px){.front-page-content .clients-section{ padding-bottom: calc(5.85938vw + -15px); }} @media screen and (min-width: 1280px){.front-page-content .clients-section{ padding-bottom: 60px; }} .front-page-content .clients-section h2{ color: #1e283c; font-size: 24px; font-weight: 700; line-height: 1.5; margin-bottom: 16px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.front-page-content .clients-section h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 16px; }} @media (min-width: 992px){.front-page-content .clients-section h2{ font-size: 36px; letter-spacing: 2px; margin-bottom: 24px; }} @media (min-width: 1200px){.front-page-content .clients-section h2{ font-size: 40px; letter-spacing: 3px; margin-bottom: 24px; }} .front-page-content .clients-section h2::after{ content: ""; display: none; } .front-page-content .clients-section .subcopy{ text-align: center; padding: 0 16px; font-size: 14px; line-height: 1.6; margin-bottom: 24px; } @media (min-width: 768px){.front-page-content .clients-section .subcopy{ font-size: 16px; margin-bottom: 32px; }} @media (min-width: 992px){.front-page-content .clients-section .subcopy{ font-size: 18px; margin-bottom: 40px; }} @media (min-width: 1200px){.front-page-content .clients-section .subcopy{ font-size: 20px; margin-bottom: 60px; }} .front-page-content .clients-section ul{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -10px auto; padding: 0 15px; } @media screen and (max-width: 767px){.front-page-content .clients-section ul{ padding: 0; }} .front-page-content .clients-section ul > li{ background: #fff; margin: 4px 10px; padding: 10px; width: calc(100% / 3 - 20px); } @media (min-width: 640px){.front-page-content .clients-section ul > li{ width: calc(100% / 4 - 20px); margin: 10px; }} @media (min-width: 960px){.front-page-content .clients-section ul > li{ width: calc(100% / 5 - 20px); }} @media (min-width: 1280px){.front-page-content .clients-section ul > li{ width: calc(100% / 6 - 20px); }} @media (min-width: 1600px){.front-page-content .clients-section ul > li{ width: calc(100% / 8 - 20px); }} @media (min-width: 1920px){.front-page-content .clients-section ul > li{ width: calc(100% / 10 - 20px); }} .front-page-content .clients-section ul > li,.front-page-content .clients-section ul > li > a{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .front-page-content .clients-section ul > li > a,.front-page-content .clients-section ul > li > span{ border: 1px solid rgba(255, 255, 255, 0); margin: -10px; padding: 10px; } @media (max-width: 639px){.front-page-content .clients-section ul > li > a,.front-page-content .clients-section ul > li > span{ padding: 5px; }} .front-page-content .clients-section ul > li > a{ height: calc(100% + 20px); position: relative; width: calc(100% + 20px); border-color: rgba(30, 60, 140, 0.4); border-radius: 4px; } @media (min-width: 768px){.front-page-content .clients-section ul > li > a{ border-radius: 8px; }} .front-page-content .clients-section ul > li > a::after{ background-size: contain; content: ""; display: block; height: 0; position: absolute; padding-bottom: 10%; right: 2.6667%; top: 5.4%; width: 10%; opacity: 0.4; -webkit-transition: all 300ms ease; transition: all 300ms ease; } .front-page-content .clients-section ul > li > a:hover{ border-color: #1e3c8c; } .front-page-content .clients-section ul > li > a:hover::after{ opacity: 1.0; } .front-page-content .clients-section ul > li img{ max-height: 100%; } .front-page-content .case-studies-section{ padding-top: 0px; padding-bottom: 60px; background-color: #ffffff; } @media screen and (min-width: 768px){.front-page-content .case-studies-section{ padding-top: calc(0vw + 0px); }} @media screen and (min-width: 1280px){.front-page-content .case-studies-section{ padding-top: 0px; }} @media screen and (min-width: 768px){.front-page-content .case-studies-section{ padding-bottom: calc(11.71875vw + -30px); }} @media screen and (min-width: 1280px){.front-page-content .case-studies-section{ padding-bottom: 120px; }} .front-page-content .case-studies-section .post-list{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; } .page .post-list{ margin: 0; } .front-page-content .case-studies-section .post-list > li{ display: -webkit-box; display: -ms-flexbox; display: flex; margin: 0; padding: 15px; } @media (min-width: 640px){.front-page-content .case-studies-section .post-list > li{ width: 50%; }} @media (min-width: 960px){.front-page-content .case-studies-section .post-list > li{ width: calc(100% / 3); }} @media (max-width: 767px){.front-page-content .case-studies-section .post-list.category{ padding: 25px 10px 0; }} @media (min-width: 640px){.front-page-content .case-studies-section .post-list.category > li{ width: 50%; }} .front-page-content .case-studies-section .post-list .card{ background: #fff; -webkit-box-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.2); box-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.2); display: -webkit-box; display: -ms-flexbox; display: flex; border-radius: 8px; } .front-page-content .case-studies-section .post-list .card > a{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .front-page-content .case-studies-section .post-list .card > a:hover .post-thumbnail{ -webkit-transform: translateY(-9px); transform: translateY(-9px); } .front-page-content .case-studies-section .post-list .card .post-thumbnail{ margin-bottom: -10px; text-align: center; -webkit-transition: -webkit-transform 0.25s ease-in-out; transition: -webkit-transform 0.25s ease-in-out; transition: transform 0.25s ease-in-out; transition: transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out; } .front-page-content .case-studies-section .post-list .card .post-thumbnail > img{ border-radius: 8px 8px 0 0; } .front-page-content .case-studies-section .post-list .card .card-body{ background: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding: 24px 24px; position: relative; } .front-page-content .case-studies-section .post-list .card .card-footer{ border-top: 1px solid #e8e9eb; padding: 12px 24px; } .front-page-content .case-studies-section .post-list .card .post-meta{ margin-bottom: 12px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .front-page-content .case-studies-section .post-list .card .cat{ font-size: 14px; line-height: 20px; margin-right: 12px; padding: 2px 12px; -ms-flex-negative: 0; flex-shrink: 0; } @media (max-width: 991px){.front-page-content .case-studies-section .post-list .card .cat{ font-size: 14px; line-height: 18px; }} .front-page-content .case-studies-section .post-list .card .post-date{ color: #787e8a; font-size: 16px; line-height: 20px; } @media (max-width: 991px){.front-page-content .case-studies-section .post-list .card .post-date{ font-size: 14px; line-height: 18px; }} .front-page-content .case-studies-section .post-list .card .post-title{ color: #1e283c; font-size: 16px; line-height: 1.5; margin: 0; } .front-page-content .case-studies-section .post-list .card .post-client{ color: #787e8a; font-weight: 700; font-size: 14px; margin-bottom: 6px; } .front-page-content .case-studies-section .post-list .card .post-client-items{ color: #787e8a; font-size: 12px; margin-bottom: 6px; } .front-page-content .case-studies-section .post-list .card ul.post-client-type{ color: #ffffff; font-size: 12px; margin: 0; } .front-page-content .case-studies-section .post-list .card ul.post-client-type li{ display: inline-block; padding: 4px 12px; margin: 0 4px 4px 0; } .front-page-content .case-studies-section .post-list .card ul.post-client-type li.retail{ background: #2d5dea; } .front-page-content .case-studies-section .post-list .card ul.post-client-type li.wholesale{ background: #009688; } .front-page-content .case-studies-section .post-list .card ul.post-client-type li.store{ background: #5aaa3c; } .front-page-content .case-studies-section .post-list .card ul.post-client-type li.ec{ background: #00bcd4; } .front-page-content .case-studies-section .post-list .card ul.post-client-type li.outlet{ background: #ba68c8; } .front-page-content .case-studies-section a.CTA-btn{ display: block; color: #ffffff; text-align: center; font-weight: 700; background-color: #1e3c8c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #1e3c8c)); background-image: linear-gradient(to right, transparent 50%, #1e3c8c 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #1e3c8c; font-size: 14px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 10px 28px; border-radius: 60px; margin: 20px auto 0; } .front-page-content .case-studies-section a.CTA-btn:hover{ background-color: transparent; background-position: left center; } .front-page-content .case-studies-section a.CTA-btn:hover{ color: #1e3c8c; } @media (min-width: 768px){.front-page-content .case-studies-section a.CTA-btn{ margin: 40px auto 0; font-size: 16px; padding: 12px 36px; }} @media (min-width: 992px){.front-page-content .case-studies-section a.CTA-btn{ font-size: 18px; padding: 14px 44px; }} @media (min-width: 1200px){.front-page-content .case-studies-section a.CTA-btn{ font-size: 20px; padding: 16px 52px; }} .front-page-content .merit-section{ padding-top: 60px; padding-bottom: 30px; background-color: #f4f6fA; } @media screen and (min-width: 768px){.front-page-content .merit-section{ padding-top: calc(11.71875vw + -30px); }} @media screen and (min-width: 1280px){.front-page-content .merit-section{ padding-top: 120px; }} @media screen and (min-width: 768px){.front-page-content .merit-section{ padding-bottom: calc(9.76562vw + -45px); }} @media screen and (min-width: 1280px){.front-page-content .merit-section{ padding-bottom: 80px; }} .front-page-content .merit-section h2{ color: #1e3c8c; } @media (min-width: 992px){.front-page-content .merit-section .row{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }} .front-page-content .merit-section .row .content-graphic{ text-align: center; margin-bottom: 40px; } @media (min-width: 768px){.front-page-content .merit-section .row .content-graphic{ margin-bottom: 60px; }} @media (min-width: 992px){.front-page-content .merit-section .row .content-graphic{ margin-bottom: 0px; }} .front-page-content .merit-section .row .content-graphic img{ width: 90%; max-width: 480px; } @media (min-width: 768px){.front-page-content .merit-section .row .content-graphic img{ width: 80%; max-width: 640px; }} @media (min-width: 992px){.front-page-content .merit-section .row .content-graphic img{ width: 100%; max-width: 100%; }} .front-page-content .merit-section .row .content-text .number{ display: inline-block; color: #1e3c8c; font-size: 14px; font-weight: 700; border-bottom: 3px solid #1e3c8c; padding-bottom: 3px; margin-bottom: 12px; } @media (min-width: 768px){.front-page-content .merit-section .row .content-text .number{ font-size: 18px; margin-bottom: 16px; }} .front-page-content .merit-section .row .content-text h3{ color: #1e283c; font-size: 20px; line-height: 1.5; margin: 0 0 16px; } @media (min-width: 768px){.front-page-content .merit-section .row .content-text h3{ font-size: 32px; }} @media (min-width: 992px){.front-page-content .merit-section .row .content-text h3{ font-size: 28px; margin: 0 0 24px; }} @media (min-width: 1200px){.front-page-content .merit-section .row .content-text h3{ font-size: 32px; }} .front-page-content .merit-section .row .content-text p{ color: #1e283c; font-size: 14px; margin-bottom: 10px; } @media screen and (min-width: 768px){.front-page-content .merit-section .row .content-text p{ font-size: 16px; }} @media screen and (min-width: 992px){.front-page-content .merit-section .row .content-text p{ font-size: 16px; margin-bottom: 0; }} .front-page-content .product-section{ padding-top: 30px; padding-bottom: 40px; background-color: #ffffff; } @media screen and (min-width: 768px){.front-page-content .product-section{ padding-top: calc(13.67188vw + -75px); }} @media screen and (min-width: 1280px){.front-page-content .product-section{ padding-top: 100px; }} @media screen and (min-width: 768px){.front-page-content .product-section{ padding-bottom: calc(15.625vw + -80px); }} @media screen and (min-width: 1280px){.front-page-content .product-section{ padding-bottom: 120px; }} .front-page-content .product-section .card{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background-color: #fff; -webkit-box-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.2); box-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.2); border-radius: 8px; margin: 0 auto 24px; width: 80%; } @media (min-width: 768px){.front-page-content .product-section .card{ width: 100%; margin: 0 auto 32px; min-height: 370px; }} @media (min-width: 1200px){.front-page-content .product-section .card{ margin: 0 auto 32px; min-height: 370px; }} .front-page-content .product-section .card:hover{ -webkit-box-shadow: 0 10px 20px 0 rgba(30, 60, 140, 0.25); box-shadow: 0 10px 20px 0 rgba(30, 60, 140, 0.25); } .front-page-content .product-section .card img{ width: 100%; max-width: 400px; } .front-page-content .product-section .card .content{ -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 32px 32px 24px 32px; } @media (min-width: 1200px){.front-page-content .product-section .card .content{ padding: 32px 32px 24px 32px; }} .front-page-content .product-section .card .content .logo{ text-align: center; margin-bottom: 24px; } .front-page-content .product-section .card .content .text{ line-height: 1.8; font-size: 15px; margin-bottom: 24px; } @media (min-width: 768px){.front-page-content .product-section .card .content .text{ font-size: 15px; margin-bottom: auto; }} @media (min-width: 992px){.front-page-content .product-section .card .content .text{ font-size: 16px; }} @media (min-width: 1200px){.front-page-content .product-section .card .content .text{ font-size: 16px; }} .front-page-content .product-section .card .content .pic{ margin: 0 -12px 24px -12px; } .front-page-content .product-section .card .content .issue{ margin-top: auto; } .front-page-content .product-section .card .content .issue .title{ text-align: center; color: #fff; font-weight: 700; font-size: 16px; padding: 2px 4px; border-radius: 24px; margin-bottom: 12px; background-color: #a5a9b1; } .front-page-content .product-section .card .content .issue .point{ color: #787e8a; line-height: 1.8; font-size: 14px; } @media (min-width: 992px){.front-page-content .product-section .card .content .issue .point{ font-size: 16px; }} @media (min-width: 1200px){.front-page-content .product-section .card .content .issue .point{ font-size: 16px; }} .front-page-content .product-section a.CTA-btn{ display: block; color: #ffffff; text-align: center; font-weight: 700; background-color: #1e3c8c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #1e3c8c)); background-image: linear-gradient(to right, transparent 50%, #1e3c8c 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #1e3c8c; font-size: 14px; line-height: 1.2; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 10px 28px; border-radius: 60px; margin: 20px auto 0; -webkit-box-shadow: none; box-shadow: none; } .front-page-content .product-section a.CTA-btn:hover{ background-color: transparent; background-position: left center; } .front-page-content .product-section a.CTA-btn:hover{ color: #1e3c8c; } @media (min-width: 768px){.front-page-content .product-section a.CTA-btn{ font-size: 16px; padding: 12px 36px; }} @media (min-width: 992px){.front-page-content .product-section a.CTA-btn{ margin: 20px auto 0; font-size: 18px; padding: 14px 44px; }} @media (min-width: 1200px){.front-page-content .product-section a.CTA-btn{ font-size: 20px; padding: 16px 52px; }} .front-page-content .FAQ-section{ padding-top: 60px; padding-bottom: 60px; background-color: #f4f6fA; } @media screen and (min-width: 768px){.front-page-content .FAQ-section{ padding-top: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.front-page-content .FAQ-section{ padding-top: 80px; }} @media screen and (min-width: 768px){.front-page-content .FAQ-section{ padding-bottom: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.front-page-content .FAQ-section{ padding-bottom: 80px; }} .front-page-content .FAQ-section .item{ border-bottom: 1px solid #d2d4d8; margin-bottom: 0; padding-bottom: 0; } @media (min-width: 768px){.front-page-content .FAQ-section .item{ margin-bottom: 0; padding-bottom: 0; }} .front-page-content .FAQ-section .item[open] .question{ color: #1e3c8c; } .front-page-content .FAQ-section .item[open] .answer{ max-height: 500px; opacity: 1; visibility: visible; padding: 16px 0 32px 2em; } .front-page-content .FAQ-section .item .question{ text-indent: -2em; padding-left: 2em; padding-top: 16px; padding-bottom: 16px; font-size: 14px; font-weight: bold; line-height: 1.5; color: #1e283c; margin: 0; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transition: color 0.3s ease; transition: color 0.3s ease; } @media (min-width: 768px){.front-page-content .FAQ-section .item .question{ padding-top: 24px; padding-bottom: 24px; font-size: 16px; }} @media (min-width: 1200px){.front-page-content .FAQ-section .item .question{ font-size: 18px; }} .front-page-content .FAQ-section .item .question::after{ content: ''; display: inline-block; width: 10px; height: 10px; border-right: 2px solid #1e3c8c; border-bottom: 2px solid #1e3c8c; margin-left: auto; margin-right: 12px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } @media (min-width: 768px){.front-page-content .FAQ-section .item .question::after{ width: 12px; height: 12px; }} .front-page-content .FAQ-section .item[open] .question::after{ -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -6px; } .front-page-content .FAQ-section .item .answer{ text-indent: -2em; padding-left: 2em; font-size: 14px; line-height: 1.5; color: #1e283c; margin: 0; max-height: 0; opacity: 0; visibility: hidden; overflow: hidden; -webkit-transition: max-height 0.3s ease, opacity 0.3s ease, visibility 0.3s ease, padding 0.3s ease; transition: max-height 0.3s ease, opacity 0.3s ease, visibility 0.3s ease, padding 0.3s ease; } @media (min-width: 768px){.front-page-content .FAQ-section .item .answer{ font-size: 16px; }} @media (min-width: 1200px){.front-page-content .FAQ-section .item .answer{ font-size: 18px; }} .front-page-content .contact-section{ padding-top: 60px; padding-bottom: 60px; position: relative; overflow: hidden; background-color: #1e3c8c; text-align: center; } @media screen and (min-width: 768px){.front-page-content .contact-section{ padding-top: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.front-page-content .contact-section{ padding-top: 80px; }} @media screen and (min-width: 768px){.front-page-content .contact-section{ padding-bottom: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.front-page-content .contact-section{ padding-bottom: 80px; }} .front-page-content .contact-section .gradient-bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 0; pointer-events: none; } .front-page-content .contact-section .gradient-blob{ position: absolute; -webkit-filter: blur(90px); filter: blur(90px); border-radius: 50%; opacity: 0.7; -webkit-animation: fph-blobWave 25s infinite alternate ease-in-out; animation: fph-blobWave 25s infinite alternate ease-in-out; } .front-page-content .contact-section .blob-1{ top: -10%; left: -10%; width: 60vw; height: 60vw; background: #3b82f6; -webkit-animation-delay: 0s; animation-delay: 0s; } .front-page-content .contact-section .blob-2{ top: 40%; right: -20%; width: 50vw; height: 50vw; background: #60a5fa; -webkit-animation-delay: -5s; animation-delay: -5s; } .front-page-content .contact-section .blob-3{ bottom: -20%; left: 20%; width: 70vw; height: 70vw; background: #2563eb; -webkit-animation-delay: -10s; animation-delay: -10s; } .front-page-content .contact-section .blob-4{ top: 20%; left: 40%; width: 40vw; height: 40vw; background: #1d4ed8; -webkit-animation-delay: -15s; animation-delay: -15s; } .front-page-content .contact-section .container,.front-page-content .contact-section a.CTA-btn{ position: relative; z-index: 1; } .front-page-content .contact-section img{ width: 60%; max-width: 320px; margin-bottom: 20px; } @media (min-width: 768px){.front-page-content .contact-section img{ width: 100%; }} .front-page-content .contact-section img.arrow{ width: 32px; } .front-page-content .contact-section h2{ color: #ffffff; font-size: 20px; letter-spacing: 1px; margin: 0 auto 30px; } @media (min-width: 768px){.front-page-content .contact-section h2{ font-size: 28px; margin: 0 auto 40px; }} @media (min-width: 992px){.front-page-content .contact-section h2{ font-size: 32px; letter-spacing: 2px; }} @media (min-width: 1280px){.front-page-content .contact-section h2{ font-size: 36px; }} .front-page-content .contact-section h2::after{ content: ""; display: none; } .front-page-content .contact-section p{ color: #ffffff; font-size: 16px; line-height: 1.5; padding: 10px 0 40px; margin: 0; } @media (min-width: 768px){.front-page-content .contact-section p.result{ font-size: 14px; padding: 20px 0; }} @media (min-width: 992px){.front-page-content .contact-section p.result{ font-size: 18px; }} @media (min-width: 1200px){.front-page-content .contact-section p.result{ font-size: 20px; }} .front-page-content .contact-section p.result span{ color: #ffffff; } .front-page-content .contact-section a.CTA-btn{ display: block; color: #ffffff; text-align: center; font-weight: 700; background-color: #1e283c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #ffffff), color-stop(50%, #1e283c)); background-image: linear-gradient(to right, #ffffff 50%, #1e283c 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #1e283c; font-size: 14px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 10px 28px; border-radius: 60px; margin: 0 auto 0; } .front-page-content .contact-section a.CTA-btn:hover{ background-color: #ffffff; background-position: left center; } .front-page-content .contact-section a.CTA-btn:hover{ color: #1e283c; } @media (min-width: 768px){.front-page-content .contact-section a.CTA-btn{ margin: 40px auto 0; font-size: 16px; padding: 12px 36px; }} @media (min-width: 992px){.front-page-content .contact-section a.CTA-btn{ font-size: 18px; padding: 14px 44px; }} @media (min-width: 1200px){.front-page-content .contact-section a.CTA-btn{ font-size: 20px; padding: 16px 52px; }} .front-page-content .seminar-section{ padding-top: 60px; padding-bottom: 60px; margin-bottom: 0; color: #1e3c8c; } @media screen and (min-width: 768px){.front-page-content .seminar-section{ padding-top: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.front-page-content .seminar-section{ padding-top: 80px; }} @media screen and (min-width: 768px){.front-page-content .seminar-section{ padding-bottom: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.front-page-content .seminar-section{ padding-bottom: 80px; }} .front-page-content .seminar-section.wp{ padding-top: 60px; padding-bottom: 60px; background-color: #ffffff; } @media screen and (min-width: 768px){.front-page-content .seminar-section.wp{ padding-top: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.front-page-content .seminar-section.wp{ padding-top: 80px; }} @media screen and (min-width: 768px){.front-page-content .seminar-section.wp{ padding-bottom: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.front-page-content .seminar-section.wp{ padding-bottom: 80px; }} .front-page-content .seminar-section .cta-title{ text-align: center; color: #1e3c8c; font-weight: 700; font-size: 18px; line-height: 1.5; margin-bottom: 24px; letter-spacing: 1px; } @media (min-width: 768px){.front-page-content .seminar-section .cta-title{ font-size: 20px; }} @media (min-width: 992px){.front-page-content .seminar-section .cta-title{ font-size: 24px; letter-spacing: 2px; margin-bottom: 32px; }} @media (min-width: 1280px){.front-page-content .seminar-section .cta-title{ font-size: 32px; }} .front-page-content .seminar-section .cta-title::after{ content: ""; display: none; } .front-page-content .seminar-section .banner{ text-align: center; margin-bottom: 20px; } @media (min-width: 768px){.front-page-content .seminar-section .banner{ margin-bottom: 0px; }} .front-page-content .seminar-section .banner a{ display: block; border-radius: 8px; -webkit-box-shadow: 0 5px 20px 0 rgba(30, 60, 140, 0.2); box-shadow: 0 5px 20px 0 rgba(30, 60, 140, 0.2); width: 80%; margin: 0 auto; } @media (min-width: 768px){.front-page-content .seminar-section .banner a{ width: 100%; }} .front-page-content .seminar-section .banner a img{ border-radius: 8px; width: 100%; } .front-page-content .seminar-section .banner a:hover{ -webkit-box-shadow: 0 10px 30px 0 rgba(30, 60, 140, 0.4); box-shadow: 0 10px 30px 0 rgba(30, 60, 140, 0.4); } .front-page-content .seminar-section .tag{ display: inline-block; text-align: center; border: 1px solid #1e3c8c; font-weight: 500; font-size: 12px; border-radius: 4px; padding: 6px 18px 4px; margin: 8px auto 0; } @media (min-width: 768px){.front-page-content .seminar-section .tag{ font-size: 16px; }} .front-page-content .seminar-section a.CTA-btn{ display: block; color: #ffffff; text-align: center; font-weight: 700; background-color: #1e3c8c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #1e3c8c)); background-image: linear-gradient(to right, transparent 50%, #1e3c8c 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #1e3c8c; font-size: 14px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 10px 28px; border-radius: 60px; margin: 0 auto 0; } .front-page-content .seminar-section a.CTA-btn:hover{ background-color: transparent; background-position: left center; } .front-page-content .seminar-section a.CTA-btn:hover{ color: #1e3c8c; } @media (min-width: 768px){.front-page-content .seminar-section a.CTA-btn{ margin: 40px auto 0; font-size: 16px; padding: 12px 36px; }} @media (min-width: 992px){.front-page-content .seminar-section a.CTA-btn{ font-size: 18px; padding: 14px 44px; }} @media (min-width: 1200px){.front-page-content .seminar-section a.CTA-btn{ font-size: 20px; padding: 16px 52px; }} .front-page-content .latest-news{ background-color: #f4f6fA; padding: 40px 0; } @media (min-width: 768px){.front-page-content .latest-news{ padding: 60px 0; }} .front-page-content .latest-news .news-header{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; border-bottom: 1px solid #d2d4d8; padding-bottom: 16px; } .front-page-content .latest-news .news-header h2{ font-size: 32px; margin-bottom: 0; } @media (max-width: 767px){.front-page-content .latest-news .news-header h2{ font-size: 24px; }} .front-page-content .latest-news .news-header a{ display: block; color: #787e8a; } .front-page-content .latest-news .news-header a:hover{ color: #2d5dea; } .front-page-content .latest-news .news-header a i{ margin-right: 8px; } .front-page-content .latest-news ul li{ border-bottom: 1px solid #d2d4d8; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 16px 0; } @media (max-width: 767px){.front-page-content .latest-news ul li{ display: block; }} .front-page-content .latest-news ul li .meta{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-negative: 0; flex-shrink: 0; } @media (max-width: 767px){.front-page-content .latest-news ul li .meta{ margin-bottom: 16px; }} .front-page-content .latest-news ul li .date{ font-size: 16px; padding-right: 16px; -ms-flex-negative: 0; flex-shrink: 0; color: #787e8a; font-weight: 500; } @media (max-width: 991px){.front-page-content .latest-news ul li .date{ font-size: 14px; }} .front-page-content .latest-news ul li .cat{ font-size: 14px; line-height: 1.5; padding: 2px 12px; width: 140px; text-align: center; -ms-flex-negative: 0; flex-shrink: 0; background: #787e8a; color: #fff; } .front-page-content .latest-news ul li .cat.events-seminar{ background: #00bcd4; } .front-page-content .latest-news ul li .cat.events-exhibition{ background: #00bcd4; } .front-page-content .latest-news ul li .cat.events-extra{ background: #00bcd4; } .front-page-content .latest-news ul li .cat.media{ margin-top: 0; background: #1e3c8c; } .front-page-content .latest-news ul li .cat.releases{ background: #2d5dea; } .front-page-content .latest-news ul li .cat.blog{ background: #5aaa3c; } .front-page-content .latest-news ul li .cat a{ color: #fff; } .front-page-content .latest-news ul li .cat a:hover{ opacity: 0.6; } @media (max-width: 991px){.front-page-content .latest-news ul li .cat{ font-size: 12px; line-height: 1.5; }} .front-page-content .latest-news ul li a.title{ color: #4b5363; line-height: 1.5; font-size: 14px; } @media (min-width: 768px){.front-page-content .latest-news ul li a.title{ font-size: 16px; margin-left: 16px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }} .front-page-content .latest-news ul li a.title:hover{ color: #2d5dea; } .ZD-page .ZD-hero{ color: #fff; position: relative; background-image: url("/assets/images/ZD-hero-bg.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover; } .ZD-page .ZD-hero .inner{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: auto; position: relative; padding: 100px 0 40px; min-height: 100vh; } @media (min-width: 768px){.ZD-page .ZD-hero .inner{ padding: 120px 0 60px; min-height: auto; }} @media (min-width: 992px){.ZD-page .ZD-hero .inner{ padding: 100px 0 40px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }} @media (min-width: 1200px){.ZD-page .ZD-hero .inner{ padding: 120px 0 60px; }} .ZD-page .ZD-hero .text{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 0 16px 40px; } @media (min-width: 768px){.ZD-page .ZD-hero .text{ padding: 0 16px 60px; }} @media (min-width: 992px){.ZD-page .ZD-hero .text{ padding: 0; }} @media (min-width: 1200px){.ZD-page .ZD-hero .text{ padding: 0; }} .ZD-page .ZD-hero h1{ color: #fff; font-weight: 700; line-height: 1.4; letter-spacing: 2px; margin-top: 0px; margin-bottom: 12px; font-size: calc(2vw + 32px); text-align: center; text-shadow: 0 0 10px #1e3c8c; } @media (min-width: 768px){.ZD-page .ZD-hero h1{ font-size: 60px; margin-bottom: 12px; }} @media (min-width: 992px){.ZD-page .ZD-hero h1{ font-size: 48px; margin-bottom: 8px; }} @media (min-width: 1200px){.ZD-page .ZD-hero h1{ font-size: 56px; margin-bottom: 8px; }} @media (min-width: 1440px){.ZD-page .ZD-hero h1{ font-size: 60px; margin-bottom: 12px; }} .ZD-page .ZD-hero .subcopy{ text-align: center; text-shadow: 0 0 10px #1e3c8c; font-weight: 400; line-height: 1.4; letter-spacing: 1px; font-size: calc(1.5vw + 14px); margin-bottom: 40px; } @media (min-width: 768px){.ZD-page .ZD-hero .subcopy{ font-size: 24px; margin-bottom: 60px; }} @media (min-width: 992px){.ZD-page .ZD-hero .subcopy{ font-size: 20px; margin-bottom: 48px; }} @media (min-width: 1200px){.ZD-page .ZD-hero .subcopy{ font-size: 24px; margin-bottom: 60px; }} @media (min-width: 1440px){.ZD-page .ZD-hero .subcopy{ font-size: 24px; margin-bottom: 60px; }} .ZD-page .ZD-hero .logo{ margin: 0 auto 12px; width: 200px; } @media (min-width: 768px){.ZD-page .ZD-hero .logo{ margin: 0 auto 16px; width: 260px; }} @media (min-width: 992px){.ZD-page .ZD-hero .logo{ width: 240px; }} @media (min-width: 1200px){.ZD-page .ZD-hero .logo{ width: 260px; }} @media (min-width: 1440px){.ZD-page .ZD-hero .logo{ width: 260px; }} .ZD-page .ZD-hero .logo img{ width: 100%; } .ZD-page .ZD-hero .btn-cta a.btn-common{ background-color: #FFC800; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #FFC800)); background-image: linear-gradient(to right, #fff 50%, #FFC800 50%); background-size: 200% 100%; background-position: right center; display: block; color: #1e3c8c; border: none; font-size: 14px; font-weight: 600; margin: 0 auto; padding: 8px 16px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } .ZD-page .ZD-hero .btn-cta a.btn-common:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.ZD-page .ZD-hero .btn-cta a.btn-common{ font-size: 16px; padding: 12px 24px; }} @media (min-width: 992px){.ZD-page .ZD-hero .btn-cta a.btn-common{ font-size: 16px; margin: 0 auto 0; }} .ZD-page .ZD-hero .btn-cta a.btn-common:hover{ color: #1e3c8c; } .ZD-page .ZD-hero .btn-cta a.btn-common i{ font-size: 18px; margin-right: 6px; vertical-align: middle; margin-top: -2px; } @media screen and (min-width: 768px){.ZD-page .ZD-hero .btn-cta a.btn-common i{ font-size: 18px; margin-right: 8px; }} @media screen and (min-width: 1200px){.ZD-page .ZD-hero .btn-cta a.btn-common i{ font-size: 20px; margin-right: 8px; }} .ZD-page .ZD-hero .inquiry{ margin-top: 12px; text-align: center; } @media screen and (min-width: 992px){.ZD-page .ZD-hero .inquiry{ margin-top: 16px; }} .ZD-page .ZD-hero .inquiry a{ color: #FFC800; font-size: 14px; } @media screen and (min-width: 992px){.ZD-page .ZD-hero .inquiry a{ font-size: 16px; }} .ZD-page .ZD-hero .inquiry a:hover{ color: #ffffff; } .ZD-page .ZD-hero figure.mock{ max-width: none; width: 80%; } @media (min-width: 768px){.ZD-page .ZD-hero figure.mock{ width: 480px; }} @media (min-width: 992px){.ZD-page .ZD-hero figure.mock{ width: 520px; padding-left: 0px; }} @media (min-width: 1200px){.ZD-page .ZD-hero figure.mock{ width: 600px; }} .ZD-page .ZD-hero figure.mock img{ width: 100%; } .ZD-page .ZD-content ul{ list-style: none; margin: 0; } .ZD-page .ZD-content li{ margin: 0; } .ZD-page .ZD-content section h2{ color: #1e3c8c; font-size: 24px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.ZD-page .ZD-content section h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 48px; }} @media (min-width: 992px){.ZD-page .ZD-content section h2{ font-size: 40px; letter-spacing: 2px; margin-bottom: 60px; }} .ZD-page .ZD-content section h2::after{ content: ""; display: block; margin: 16px auto 0; width: 36px; height: 4px; border-radius: 3px; background-color: #1e3c8c; opacity: 0.2; } @media (min-width: 768px){.ZD-page .ZD-content section h2::after{ width: 48px; margin: 20px auto 0; height: 6px; }} @media (min-width: 992px){.ZD-page .ZD-content section h2::after{ width: 60px; margin: 24px auto 0; height: 6px; }} .ZD-page .ZD-content section h3{ letter-spacing: 1px; } .ZD-page .ZD-content section p{ color: #4b5363; font-size: 15px; line-height: 2; margin-bottom: 2em; } @media (min-width: 768px){.ZD-page .ZD-content section p{ font-size: 16px; }} @media (min-width: 992px){.ZD-page .ZD-content section p{ font-size: 18px; }} .ZD-page .ZD-content section p:last-child{ margin-bottom: 0; } .ZD-page .ZD-content .overview-section{ padding-top: 30px; padding-bottom: 30px; background-color: #ffffff; } @media screen and (min-width: 480px){.ZD-page .ZD-content .overview-section{ padding-top: calc(8.75vw + -12px); }} @media screen and (min-width: 1280px){.ZD-page .ZD-content .overview-section{ padding-top: 100px; }} @media screen and (min-width: 480px){.ZD-page .ZD-content .overview-section{ padding-bottom: calc(8.75vw + -12px); }} @media screen and (min-width: 1280px){.ZD-page .ZD-content .overview-section{ padding-bottom: 100px; }} .ZD-page .ZD-content .overview-section h2{ color: #1e283c; } @media (min-width: 768px){.ZD-page .ZD-content .overview-section h2{ font-size: 32px; margin: 0 auto 24px; }} @media (min-width: 992px){.ZD-page .ZD-content .overview-section h2{ font-size: 36px; letter-spacing: 2px; }} @media (min-width: 1280px){.ZD-page .ZD-content .overview-section h2{ font-size: 40px; }} .ZD-page .ZD-content .overview-section h2::after{ display: none; } .ZD-page .ZD-content .overview-section h2 span{ color: #1e3c8c; } .ZD-page .ZD-content .overview-section .lead{ color: #1e283c; font-size: 16px; line-height: 1.8; margin-bottom: 30px; } @media (min-width: 768px){.ZD-page .ZD-content .overview-section .lead{ text-align: center; font-size: 18px; }} @media (min-width: 992px){.ZD-page .ZD-content .overview-section .lead{ font-size: 20px; margin-bottom: 60px; }} .ZD-page .ZD-content .overview-section .pic{ text-align: center; } .ZD-page .ZD-content .overview-section .pic img{ width: 90%; } @media (min-width: 768px){.ZD-page .ZD-content .overview-section .pic img{ width: 90%; }} .ZD-page .ZD-content .overview-section .pic .MB{ text-align: center; } @media (min-width: 992px){.ZD-page .ZD-content .overview-section .pic .MB{ display: none; }} .ZD-page .ZD-content .overview-section .pic .PC{ display: none; } @media (min-width: 992px){.ZD-page .ZD-content .overview-section .pic .PC{ display: block; }} .ZD-page .ZD-content .overview-section a.CTA-btn{ display: block; color: #ffffff; text-align: center; font-weight: 700; background-color: #1e3c8c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #1e3c8c)); background-image: linear-gradient(to right, transparent 50%, #1e3c8c 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #1e3c8c; font-size: 16px; line-height: 1.2; width: 280px; padding: 8px; border-radius: 60px; margin: 40px auto 0; } .ZD-page .ZD-content .overview-section a.CTA-btn:hover{ background-color: transparent; background-position: left center; } .ZD-page .ZD-content .overview-section a.CTA-btn:hover{ color: #1e3c8c; } @media (min-width: 768px){.ZD-page .ZD-content .overview-section a.CTA-btn{ font-size: 20px; width: 320px; padding: 12px; }} @media (min-width: 992px){.ZD-page .ZD-content .overview-section a.CTA-btn{ margin: 60px auto 0; font-size: 22px; width: 360px; padding: 14px; }} @media (min-width: 1200px){.ZD-page .ZD-content .overview-section a.CTA-btn{ font-size: 24px; width: 400px; padding: 16px; }} .ZD-page .ZD-content .point-section{ padding-top: 60px; padding-bottom: 0px; background-color: #f5faff; } @media screen and (min-width: 768px){.ZD-page .ZD-content .point-section{ padding-top: calc(19.53125vw + -90px); }} @media screen and (min-width: 1280px){.ZD-page .ZD-content .point-section{ padding-top: 160px; }} @media screen and (min-width: 768px){.ZD-page .ZD-content .point-section{ padding-bottom: calc(0vw + 0px); }} @media screen and (min-width: 1280px){.ZD-page .ZD-content .point-section{ padding-bottom: 0px; }} .ZD-page .ZD-content .point-section h2{ margin-bottom: 30px; } @media (min-width: 768px){.ZD-page .ZD-content .point-section h2{ margin-bottom: 60px; }} @media (min-width: 992px){.ZD-page .ZD-content .point-section h2{ margin-bottom: 100px; }} .ZD-page .ZD-content .point-section .row{ padding-bottom: 24px; } @media (min-width: 768px){.ZD-page .ZD-content .point-section .row{ padding-bottom: 32px; }} @media (min-width: 992px){.ZD-page .ZD-content .point-section .row{ padding-bottom: 24px; }} .ZD-page .ZD-content .point-section .row .content-graphic{ text-align: center; } .ZD-page .ZD-content .point-section .row .content-graphic img{ width: 100%; -webkit-box-shadow: 0 0 10px rgba(30, 60, 140, 0.2); box-shadow: 0 0 10px rgba(30, 60, 140, 0.2); } .ZD-page .ZD-content .point-section .row .content-text{ padding-bottom: 20px; } .ZD-page .ZD-content .point-section .row .content-text .number{ display: inline-block; color: #1e3c8c; background-color: #ffffff; font-size: 14px; font-weight: 700; border: 2px solid #1e3c8c; border-radius: 40px; padding: 8px 16px; margin-bottom: 12px; } @media (min-width: 768px){.ZD-page .ZD-content .point-section .row .content-text .number{ font-size: 18px; }} .ZD-page .ZD-content .point-section .row .content-text h3{ color: #1e283c; font-size: 22px; line-height: 1.5; margin: 0 0 16px; } @media (min-width: 768px){.ZD-page .ZD-content .point-section .row .content-text h3{ font-size: 32px; }} @media (min-width: 992px){.ZD-page .ZD-content .point-section .row .content-text h3{ font-size: 30px; margin: 0 0 32px; }} @media (min-width: 1200px){.ZD-page .ZD-content .point-section .row .content-text h3{ font-size: 36px; }} .ZD-page .ZD-content .point-section .row .content-text p{ color: #1e283c; font-size: 14px; margin-bottom: 0; } @media screen and (min-width: 768px){.ZD-page .ZD-content .point-section .row .content-text p{ font-size: 16px; }} @media screen and (min-width: 992px){.ZD-page .ZD-content .point-section .row .content-text p{ font-size: 16px; }} @media screen and (min-width: 1200px){.ZD-page .ZD-content .point-section .row .content-text p{ font-size: 18px; }} .ZD-page .ZD-content .point-section .example{ padding-bottom: 60px; } @media (min-width: 768px){.ZD-page .ZD-content .point-section .example{ padding-bottom: 100px; }} @media (min-width: 992px){.ZD-page .ZD-content .point-section .example{ padding-bottom: 160px; }} .ZD-page .ZD-content .point-section .example h4{ width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; color: #1e283c; font-size: 14px; font-weight: 700; border-bottom: 3px solid #1e283c; padding-bottom: 3px; margin-bottom: 12px; margin-left: 15px; } @media (min-width: 768px){.ZD-page .ZD-content .point-section .example h4{ font-size: 18px; margin-bottom: 24px; }} .ZD-page .ZD-content .point-section .example .example-item{ border-radius: 8px; border: 1px solid #1e283c; margin-bottom: 12px; } @media (min-width: 768px){.ZD-page .ZD-content .point-section .example .example-item{ margin-bottom: 16px; }} .ZD-page .ZD-content .point-section .example .example-item.green{ border: 1px solid #5aaa3c; } .ZD-page .ZD-content .point-section .example .example-item.orange{ border: 1px solid #ff9800; } .ZD-page .ZD-content .point-section .example .example-item.viridian{ border: 1px solid #009688; } .ZD-page .ZD-content .point-section .example .example-item.lightblue{ border: 1px solid #1E82E6; } .ZD-page .ZD-content .point-section .example .example-item .example-title{ text-align: center; color: #ffffff; font-weight: 700; font-size: 16px; padding: 4px; background-color: #1e283c; border-radius: 6px 6px 0 0; } @media (min-width: 768px){.ZD-page .ZD-content .point-section .example .example-item .example-title{ font-size: 18px; padding: 8px; }} @media (min-width: 992px){.ZD-page .ZD-content .point-section .example .example-item .example-title{ font-size: 20px; padding: 8px; }} .ZD-page .ZD-content .point-section .example .example-item .example-title.green{ background-color: #5aaa3c; } .ZD-page .ZD-content .point-section .example .example-item .example-title.orange{ background-color: #ff9800; } .ZD-page .ZD-content .point-section .example .example-item .example-title.viridian{ background-color: #009688; } .ZD-page .ZD-content .point-section .example .example-item .example-title.lightblue{ background-color: #1E82E6; } .ZD-page .ZD-content .point-section .example .example-item p{ color: #1e283c; font-size: 14px; line-height: 1.5; padding: 16px; } @media (min-width: 768px){.ZD-page .ZD-content .point-section .example .example-item p{ font-size: 16px; padding: 16px; }} @media (min-width: 992px){.ZD-page .ZD-content .point-section .example .example-item p{ font-size: 16px; padding: 20px; }} @media (min-width: 1200px){.ZD-page .ZD-content .point-section .example .example-item p{ padding: 24px; }} .ZD-page .ZD-content .comparison-section{ padding-top: 60px; padding-bottom: 60px; background-color: #ffffff; } @media screen and (min-width: 768px){.ZD-page .ZD-content .comparison-section{ padding-top: calc(19.53125vw + -90px); }} @media screen and (min-width: 1280px){.ZD-page .ZD-content .comparison-section{ padding-top: 160px; }} @media screen and (min-width: 768px){.ZD-page .ZD-content .comparison-section{ padding-bottom: calc(19.53125vw + -90px); }} @media screen and (min-width: 1280px){.ZD-page .ZD-content .comparison-section{ padding-bottom: 160px; }} .ZD-page .ZD-content .comparison-section h2{ margin-bottom: 30px; } @media (min-width: 768px){.ZD-page .ZD-content .comparison-section h2{ margin-bottom: 60px; }} @media (min-width: 992px){.ZD-page .ZD-content .comparison-section h2{ margin-bottom: 100px; }} .ZD-page .ZD-content .comparison-section h4{ color: #1e283c; margin-bottom: 12px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } @media (min-width: 768px){.ZD-page .ZD-content .comparison-section h4{ margin-bottom: 16px; }} @media (min-width: 992px){.ZD-page .ZD-content .comparison-section h4{ margin-bottom: 16px; }} .ZD-page .ZD-content .comparison-section h4 img{ width: 200px; } @media (min-width: 768px){.ZD-page .ZD-content .comparison-section h4 img{ width: 240px; }} @media (min-width: 992px){.ZD-page .ZD-content .comparison-section h4 img{ width: 300px; }} .ZD-page .ZD-content .comparison-section .comparison-item{ padding: 24px; border-radius: 8px; margin-bottom: 32px; } @media (min-width: 768px){.ZD-page .ZD-content .comparison-section .comparison-item{ padding: 24px; min-height: 264px; margin-bottom: 0px; }} @media (min-width: 992px){.ZD-page .ZD-content .comparison-section .comparison-item{ padding: 32px; min-height: auto; }} .ZD-page .ZD-content .comparison-section .comparison-item.black{ background-color: rgba(30, 40, 60, 0.1); color: #1e283c; } .ZD-page .ZD-content .comparison-section .comparison-item.navy{ background-color: rgba(30, 60, 140, 0.1); color: #1e3c8c; } .ZD-page .ZD-content .comparison-section .comparison-item ul{ list-style: none; padding: 0; margin: 0; } .ZD-page .ZD-content .comparison-section .comparison-item li{ line-height: 1.5; font-size: 14px; margin-bottom: 10px; position: relative; } @media (min-width: 768px){.ZD-page .ZD-content .comparison-section .comparison-item li{ font-size: 16px; margin-bottom: 12px; }} @media (min-width: 992px){.ZD-page .ZD-content .comparison-section .comparison-item li{ font-size: 18px; margin-bottom: 16px; }} .ZD-page .ZD-content .comparison-section .comparison-item li:last-child{ margin-bottom: 0; } .ZD-page .ZD-content .CS-section{ padding-top: 60px; padding-bottom: 20px; background-color: #ffffff; } @media screen and (min-width: 480px){.ZD-page .ZD-content .CS-section{ padding-top: calc(12.5vw + 0px); }} @media screen and (min-width: 1280px){.ZD-page .ZD-content .CS-section{ padding-top: 160px; }} @media screen and (min-width: 480px){.ZD-page .ZD-content .CS-section{ padding-bottom: calc(7.5vw + -16px); }} @media screen and (min-width: 1280px){.ZD-page .ZD-content .CS-section{ padding-bottom: 80px; }} .ZD-page .ZD-content .CS-section h3{ color: #1e283c; font-weight: 500; font-size: 16px; line-height: 1.5; margin-bottom: 20px; } @media (min-width: 768px){.ZD-page .ZD-content .CS-section h3{ text-align: center; font-size: 20px; margin-bottom: 40px; }} .ZD-page .ZD-content .CS-section .MB{ text-align: center; } @media (min-width: 992px){.ZD-page .ZD-content .CS-section .MB{ display: none; }} .ZD-page .ZD-content .CS-section .PC{ display: none; } @media (min-width: 992px){.ZD-page .ZD-content .CS-section .PC{ display: block; }} .ZD-page .ZD-content .CS-section .flow-MB{ width: 80%; margin-bottom: 20px; } @media (min-width: 768px){.ZD-page .ZD-content .CS-section .flow-MB{ width: 60%; margin-bottom: 30px; }} .ZD-page .ZD-content .CS-section .flow-PC{ width: 100%; margin-bottom: 20px; } @media (min-width: 768px){.ZD-page .ZD-content .CS-section .flow-PC{ margin-bottom: 30px; }} .ZD-page .ZD-content .CS-section p{ font-size: 14px; line-height: 1.5; margin-bottom: 60px !important; } @media (min-width: 768px){.ZD-page .ZD-content .CS-section p{ text-align: center; margin-bottom: 120px !important; }} .ZD-page .ZD-content .CS-section .CS-member{ padding: 0 0 10px; text-align: center; } @media (min-width: 768px){.ZD-page .ZD-content .CS-section .CS-member{ padding: 0 0 60px; }} .ZD-page .ZD-content .CS-section .CS-member h4{ color: #1e3c8c; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: 0 auto 30px; border-bottom: 3px solid #1e3c8c; font-size: 18px; } @media (min-width: 768px){.ZD-page .ZD-content .CS-section .CS-member h4{ margin: 0 auto 60px; border-bottom: 4px solid #1e3c8c; font-size: 28px; }} .ZD-page .ZD-content .CS-section .CS-member img{ width: 80%; margin-bottom: 20px; } @media (min-width: 768px){.ZD-page .ZD-content .CS-section .CS-member img{ width: 80%; margin-bottom: 40px; }} @media (min-width: 992px){.ZD-page .ZD-content .CS-section .CS-member img{ width: 100%; margin-bottom: 0px; }} .DB-page .DB-hero{ color: #fff; position: relative; background-image: url("/assets/images/DB-hero-bg.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover; } .DB-page .DB-hero .inner{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: auto; position: relative; padding: 100px 0 40px; min-height: 100vh; } @media (min-width: 768px){.DB-page .DB-hero .inner{ padding: 120px 0 60px; min-height: auto; }} @media (min-width: 992px){.DB-page .DB-hero .inner{ padding: 100px 0 40px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }} @media (min-width: 1200px){.DB-page .DB-hero .inner{ padding: 120px 0 60px; }} .DB-page .DB-hero .text{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 0 16px 40px; } @media (min-width: 768px){.DB-page .DB-hero .text{ padding: 0 16px 60px; }} @media (min-width: 992px){.DB-page .DB-hero .text{ padding: 0; }} @media (min-width: 1200px){.DB-page .DB-hero .text{ padding: 0; }} .DB-page .DB-hero h1{ color: #fff; font-weight: 700; line-height: 1.4; letter-spacing: 2px; margin-top: 0px; margin-bottom: 30px; font-size: calc(4vw + 24px); text-align: center; text-shadow: 0 0 10px #009688; } @media (min-width: 768px){.DB-page .DB-hero h1{ font-size: 64px; margin-bottom: 40px; }} @media (min-width: 992px){.DB-page .DB-hero h1{ font-size: 48px; margin-bottom: 40px; }} @media (min-width: 1200px){.DB-page .DB-hero h1{ font-size: 54px; margin-bottom: 60px; }} @media (min-width: 1440px){.DB-page .DB-hero h1{ font-size: 56px; margin-bottom: 60px; }} .DB-page .DB-hero h1.subcopy{ font-weight: 400; line-height: 2; letter-spacing: 2px; margin-top: 0; margin-bottom: 10px; font-size: calc(1.5vw + 8px); } @media (min-width: 768px){.DB-page .DB-hero h1.subcopy{ font-size: 18px; margin-bottom: 30px; }} @media (min-width: 992px){.DB-page .DB-hero h1.subcopy{ font-size: 16px; margin-bottom: 40px; }} @media (min-width: 1200px){.DB-page .DB-hero h1.subcopy{ font-size: 20px; margin-bottom: 60px; }} .DB-page .DB-hero .logo{ margin: 0 auto 12px; width: 200px; } @media (min-width: 768px){.DB-page .DB-hero .logo{ margin: 0 auto 16px; width: 260px; }} @media (min-width: 992px){.DB-page .DB-hero .logo{ width: 240px; }} @media (min-width: 1200px){.DB-page .DB-hero .logo{ width: 260px; }} @media (min-width: 1440px){.DB-page .DB-hero .logo{ width: 260px; }} .DB-page .DB-hero .logo img{ width: 100%; } .DB-page .DB-hero .btn-cta a.btn-common{ background-color: #1e283c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #1e283c)); background-image: linear-gradient(to right, #fff 50%, #1e283c 50%); background-size: 200% 100%; background-position: right center; display: block; color: #fff; border: none; font-size: 14px; font-weight: 600; margin: 0 auto; padding: 8px 16px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } .DB-page .DB-hero .btn-cta a.btn-common:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.DB-page .DB-hero .btn-cta a.btn-common{ font-size: 16px; padding: 12px 24px; }} @media (min-width: 992px){.DB-page .DB-hero .btn-cta a.btn-common{ font-size: 16px; margin: 0 auto 0; }} .DB-page .DB-hero .btn-cta a.btn-common:hover{ color: #1e283c; } .DB-page .DB-hero .btn-cta a.btn-common i{ font-size: 18px; margin-right: 6px; vertical-align: middle; margin-top: -2px; } @media screen and (min-width: 768px){.DB-page .DB-hero .btn-cta a.btn-common i{ font-size: 18px; margin-right: 8px; }} @media screen and (min-width: 1200px){.DB-page .DB-hero .btn-cta a.btn-common i{ font-size: 20px; margin-right: 8px; }} .DB-page .DB-hero .inquiry{ margin-top: 12px; text-align: center; } @media screen and (min-width: 992px){.DB-page .DB-hero .inquiry{ margin-top: 16px; }} .DB-page .DB-hero .inquiry a{ color: #ffffff; font-size: 14px; } @media screen and (min-width: 992px){.DB-page .DB-hero .inquiry a{ font-size: 16px; }} .DB-page .DB-hero .inquiry a:hover{ opacity: 0.6; } .DB-page .DB-hero figure.mock{ max-width: none; width: 80%; } @media (min-width: 768px){.DB-page .DB-hero figure.mock{ width: 480px; }} @media (min-width: 992px){.DB-page .DB-hero figure.mock{ width: 520px; padding-left: 0px; }} @media (min-width: 1200px){.DB-page .DB-hero figure.mock{ width: 600px; }} .DB-page .DB-hero figure.mock img{ width: 100%; } .DB-page .DB-content ul{ list-style: none; margin: 0; } .DB-page .DB-content li{ margin: 0; } .DB-page .DB-content section h2{ color: #009688; font-size: 24px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.DB-page .DB-content section h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 48px; }} @media (min-width: 992px){.DB-page .DB-content section h2{ font-size: 40px; letter-spacing: 2px; margin-bottom: 60px; }} .DB-page .DB-content section h2::after{ content: ""; display: block; margin: 16px auto 0; width: 36px; height: 4px; border-radius: 3px; background-color: #009688; opacity: 0.2; } @media (min-width: 768px){.DB-page .DB-content section h2::after{ width: 48px; margin: 20px auto 0; height: 6px; }} @media (min-width: 992px){.DB-page .DB-content section h2::after{ width: 60px; margin: 24px auto 0; height: 6px; }} .DB-page .DB-content section h3{ letter-spacing: 1px; } .DB-page .DB-content section p{ color: #4b5363; font-size: 15px; line-height: 2; margin-bottom: 2em; } @media (min-width: 768px){.DB-page .DB-content section p{ font-size: 16px; }} @media (min-width: 992px){.DB-page .DB-content section p{ font-size: 18px; }} .DB-page .DB-content section p:last-child{ margin-bottom: 0; } .DB-page .DB-content .logo-section{ background-color: #fff; padding: 10px 0; } @media screen and (min-width: 768px){.DB-page .DB-content .logo-section{ padding: 20px 0; }} @media screen and (min-width: 992px){.DB-page .DB-content .logo-section{ padding: 24px 0; }} @media screen and (min-width: 1200px){.DB-page .DB-content .logo-section{ padding: 36px 0; }} .DB-page .DB-content .logo-section .logo-inner{ margin: 0 auto; text-align: center; } @media screen and (min-width: 1200px){.DB-page .DB-content .logo-section .logo-inner{ width: 90%; }} @media screen and (min-width: 1600px){.DB-page .DB-content .logo-section .logo-inner{ width: 80%; }} @media screen and (min-width: 1920px){.DB-page .DB-content .logo-section .logo-inner{ width: 70%; }} .DB-page .DB-content .logo-section p{ text-align: center; font-size: 12px; color: #787e8a; margin-top: 10px; } @media screen and (min-width: 768px){.DB-page .DB-content .logo-section p{ margin-top: 30px; font-size: 12px; }} @media screen and (min-width: 1200px){.DB-page .DB-content .logo-section p{ font-size: 14px; }} .DB-page .DB-content .overview-section{ padding-top: 30px; padding-bottom: 30px; background-color: #F6F8F8; } @media screen and (min-width: 480px){.DB-page .DB-content .overview-section{ padding-top: calc(8.75vw + -12px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .overview-section{ padding-top: 100px; }} @media screen and (min-width: 480px){.DB-page .DB-content .overview-section{ padding-bottom: calc(8.75vw + -12px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .overview-section{ padding-bottom: 100px; }} .DB-page .DB-content .overview-section .row{ background-repeat: no-repeat; background-position: right -10px bottom 0px; padding-bottom: 20px; } @media (min-width: 768px){.DB-page .DB-content .overview-section .row{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }} @media (min-width: 768px){.DB-page .DB-content .overview-section .row{ background-position: right 0px top 30px; }} .DB-page .DB-content .overview-section .content-graphic{ text-align: center; } .DB-page .DB-content .overview-section .content-graphic img{ width: 80%; max-width: 360px; margin-bottom: 20px; } @media (min-width: 768px){.DB-page .DB-content .overview-section .content-graphic img{ width: 100%; max-width: 100%; margin-bottom: 0px; }} .DB-page .DB-content .overview-section .content-text p{ color: #1e283c; font-weight: 500; font-size: 16px; line-height: 2; padding: 10px 0 0; max-width: 480px; margin: 0 auto; } @media screen and (min-width: 768px){.DB-page .DB-content .overview-section .content-text p{ font-size: 18px; padding: 20px 0 0; max-width: auto; }} @media screen and (min-width: 992px){.DB-page .DB-content .overview-section .content-text p{ font-size: 20px; padding: 30px 0 0; }} .DB-page .DB-content .overview-section .content-text p a{ color: #00bcd4; } .DB-page .DB-content .overview-section .content-text p a:hover{ color: #2d5dea; } .DB-page .DB-content .success-section{ padding-top: 60px; padding-bottom: 40px; text-align: center; background-color: #ffffff; } @media screen and (min-width: 768px){.DB-page .DB-content .success-section{ padding-top: calc(19.53125vw + -90px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .success-section{ padding-top: 160px; }} @media screen and (min-width: 768px){.DB-page .DB-content .success-section{ padding-bottom: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .success-section{ padding-bottom: 100px; }} .DB-page .DB-content .success-section img{ width: 100%; margin-bottom: 30px; } @media (min-width: 768px){.DB-page .DB-content .success-section img{ width: 100%; }} .DB-page .DB-content .success-section h2{ color: #1e283c; font-size: 24px; letter-spacing: 1px; margin: 0 auto 30px; } @media (min-width: 768px){.DB-page .DB-content .success-section h2{ font-size: 28px; margin: 0 auto 60px; }} @media (min-width: 992px){.DB-page .DB-content .success-section h2{ font-size: 36px; letter-spacing: 2px; }} @media (min-width: 1280px){.DB-page .DB-content .success-section h2{ font-size: 40px; }} .DB-page .DB-content .success-section h2::after{ display: none; } .DB-page .DB-content .success-section h2 span{ color: #009688; } .DB-page .DB-content .success-section .arrow{ text-align: center; padding-bottom: 0px; } .DB-page .DB-content .success-section .arrow img{ margin-top: 0px; margin-bottom: 20px; width: 40px; } @media (min-width: 768px){.DB-page .DB-content .success-section .arrow img{ width: 60px; }} @media (min-width: 992px){.DB-page .DB-content .success-section .arrow img{ width: 90px; }} .DB-page .DB-content .problem-section{ padding-top: 60px; padding-bottom: 40px; text-align: center; background-color: #ffffff; } @media screen and (min-width: 768px){.DB-page .DB-content .problem-section{ padding-top: calc(19.53125vw + -90px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .problem-section{ padding-top: 160px; }} @media screen and (min-width: 768px){.DB-page .DB-content .problem-section{ padding-bottom: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .problem-section{ padding-bottom: 100px; }} @media (max-width: 767px){.DB-page .DB-content .problem-section{ padding-bottom: 0px; }} .DB-page .DB-content .problem-section img{ width: 60%; max-width: 320px; } @media (min-width: 768px){.DB-page .DB-content .problem-section img{ width: 100%; }} .DB-page .DB-content .problem-section img.arrow{ width: 32px; } .DB-page .DB-content .problem-section h2{ color: #1e283c; font-size: 20px; letter-spacing: 1px; margin: 0 auto 30px; } @media (min-width: 768px){.DB-page .DB-content .problem-section h2{ font-size: 24px; margin: 0 auto 40px; }} @media (min-width: 992px){.DB-page .DB-content .problem-section h2{ font-size: 28px; letter-spacing: 2px; }} @media (min-width: 1280px){.DB-page .DB-content .problem-section h2{ font-size: 32px; }} .DB-page .DB-content .problem-section h2::after{ display: none; } .DB-page .DB-content .problem-section h2 span{ color: #009688; } .DB-page .DB-content .problem-section p{ color: #1e283c; font-size: 16px; line-height: 1.5; padding: 10px 0 40px; margin: 0; } @media (min-width: 768px){.DB-page .DB-content .problem-section p.result{ font-size: 14px; padding: 20px 0; }} @media (min-width: 992px){.DB-page .DB-content .problem-section p.result{ font-size: 18px; }} @media (min-width: 1200px){.DB-page .DB-content .problem-section p.result{ font-size: 20px; }} .DB-page .DB-content .problem-section p.result span{ color: #00bcd4; } .DB-page .DB-content .merit-section{ padding-top: 60px; padding-bottom: 0px; background-color: #F6F8F8; } @media screen and (min-width: 768px){.DB-page .DB-content .merit-section{ padding-top: calc(19.53125vw + -90px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .merit-section{ padding-top: 160px; }} @media screen and (min-width: 768px){.DB-page .DB-content .merit-section{ padding-bottom: calc(0vw + 0px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .merit-section{ padding-bottom: 0px; }} .DB-page .DB-content .merit-section h2{ margin-bottom: 30px; } @media (min-width: 992px){.DB-page .DB-content .merit-section h2{ margin-bottom: 100px; }} .DB-page .DB-content .merit-section .row{ padding-bottom: 60px; } @media (min-width: 768px){.DB-page .DB-content .merit-section .row{ padding-bottom: 100px; }} .DB-page .DB-content .merit-section .row .content-graphic{ text-align: center; } .DB-page .DB-content .merit-section .row .content-text{ padding-bottom: 20px; } @media (min-width: 992px){.DB-page .DB-content .merit-section .row .content-text{ padding-bottom: 60px; }} .DB-page .DB-content .merit-section .row .content-text .number{ display: inline-block; color: #009688; font-size: 14px; font-weight: 700; border-bottom: 3px solid #009688; padding-bottom: 3px; margin-bottom: 12px; } @media (min-width: 768px){.DB-page .DB-content .merit-section .row .content-text .number{ font-size: 18px; }} .DB-page .DB-content .merit-section .row .content-text h3{ color: #1e283c; font-size: 22px; line-height: 1.5; margin: 0 0 30px; } @media (min-width: 768px){.DB-page .DB-content .merit-section .row .content-text h3{ font-size: 32px; }} @media (min-width: 992px){.DB-page .DB-content .merit-section .row .content-text h3{ font-size: 28px; margin: 0 0 60px; }} @media (min-width: 1200px){.DB-page .DB-content .merit-section .row .content-text h3{ font-size: 32px; }} .DB-page .DB-content .merit-section .row .content-text p{ color: #1e283c; font-size: 14px; margin-bottom: 10px; } @media screen and (min-width: 768px){.DB-page .DB-content .merit-section .row .content-text p{ font-size: 16px; }} @media screen and (min-width: 992px){.DB-page .DB-content .merit-section .row .content-text p{ font-size: 16px; margin-bottom: 0; }} .DB-page .DB-content .merit-section a.CTA-btn{ display: block; color: #00bcd4; text-align: center; font-weight: 700; background-color: transparent; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #00bcd4), color-stop(50%, transparent)); background-image: linear-gradient(to right, #00bcd4 50%, transparent 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #00bcd4; font-size: 16px; width: 200px; padding: 16px; border-radius: 60px; margin: 0 auto; } .DB-page .DB-content .merit-section a.CTA-btn:hover{ background-color: #00bcd4; background-position: left center; } .DB-page .DB-content .merit-section a.CTA-btn:hover{ color: #ffffff; } @media (min-width: 768px){.DB-page .DB-content .merit-section a.CTA-btn{ margin: 40px auto 0; font-size: 20px; width: 240px; padding: 20px; }} @media (min-width: 992px){.DB-page .DB-content .merit-section a.CTA-btn{ font-size: 22px; width: 280px; padding: 22px; }} @media (min-width: 1200px){.DB-page .DB-content .merit-section a.CTA-btn{ font-size: 24px; width: 300px; padding: 24px; }} .DB-page .DB-content .clients-section{ padding-top: 60px; padding-bottom: 60px; background-color: #ffffff; } @media screen and (min-width: 480px){.DB-page .DB-content .clients-section{ padding-top: calc(12.5vw + 0px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .clients-section{ padding-top: 160px; }} @media screen and (min-width: 480px){.DB-page .DB-content .clients-section{ padding-bottom: calc(12.5vw + 0px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .clients-section{ padding-bottom: 160px; }} .DB-page .DB-content .clients-section .swiper{ overflow: visible; margin-bottom: 30px; } @media (min-width: 768px){.DB-page .DB-content .clients-section .swiper{ margin-bottom: 60px; }} .DB-page .DB-content .clients-section .swiper .swiper-wrapper{ -webkit-transition-timing-function: linear !important; transition-timing-function: linear !important; } .DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide{ width: -webkit-max-content; width: -moz-max-content; width: max-content; height: auto; } .DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide{ overflow: hidden; height: 100%; width: 320px; border-radius: 8px; -webkit-box-shadow: 0 0 10px rgba(0, 150, 136, 0.15); box-shadow: 0 0 10px rgba(0, 150, 136, 0.15); padding: 16px; display: -webkit-box; display: -ms-flexbox; display: flex; } @media (min-width: 768px){.DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide{ padding: 24px; width: 480px; }} .DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide .slide-avatar{ width: 56px; padding-right: 8px; } @media (min-width: 768px){.DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide .slide-avatar{ width: 76px; padding-right: 16px; }} .DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide .slide-avatar img{ width: 48px; } @media (min-width: 768px){.DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide .slide-avatar img{ width: 60px; }} .DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide .slide-content{ -webkit-box-flex: 1; -ms-flex: 1; flex: 1; font-size: 12px; line-height: 1.5; } @media (min-width: 768px){.DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide .slide-content{ font-size: 16px; }} .DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide .slide-content .slide-name{ color: #1e283c; font-weight: 700; margin-bottom: 12px; } @media (min-width: 768px){.DB-page .DB-content .clients-section .swiper .swiper-wrapper .swiper-slide .slide .slide-content .slide-name{ margin-bottom: 16px; }} .DB-page .DB-content .clients-section .voice{ display: block; max-width: 408px; padding: 24px; border-radius: 8px; -webkit-box-shadow: 0 0 10px rgba(0, 150, 136, 0.15); box-shadow: 0 0 10px rgba(0, 150, 136, 0.15); margin: 0 auto 30px; } @media (min-width: 768px){.DB-page .DB-content .clients-section .voice{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; max-width: 100%; }} .DB-page .DB-content .clients-section .voice:hover{ -webkit-box-shadow: 0 10px 20px rgba(0, 150, 136, 0.2); box-shadow: 0 10px 20px rgba(0, 150, 136, 0.2); } .DB-page .DB-content .clients-section .voice .voice-content{ -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: left; padding-top: 24px; } @media (min-width: 768px){.DB-page .DB-content .clients-section .voice .voice-content{ padding-left: 24px; padding-top: 0; }} .DB-page .DB-content .clients-section .voice .voice-content .voice-title{ color: #1e283c; font-weight: 700; font-size: 16px; line-height: 1.5; margin-bottom: 18px; } @media (min-width: 992px){.DB-page .DB-content .clients-section .voice .voice-content .voice-title{ font-size: 18px; margin-bottom: 24px; }} .DB-page .DB-content .clients-section .voice .voice-content .post-client{ color: #787e8a; font-weight: 500; font-size: 14px; margin-bottom: 0px; } .DB-page .DB-content .clients-section .voice .voice-content .post-client-items{ color: #787e8a; font-size: 12px; margin-bottom: 6px; } .DB-page .DB-content .clients-section .voice .voice-content ul.post-client-type{ color: #ffffff; font-size: 12px; margin: 0; } .DB-page .DB-content .clients-section .voice .voice-content ul.post-client-type li{ display: inline-block; padding: 4px 12px; margin: 0 4px 4px 0; } .DB-page .DB-content .clients-section .voice .voice-content ul.post-client-type li.retail{ background: #2d5dea; } .DB-page .DB-content .clients-section .voice .voice-content ul.post-client-type li.wholesale{ background: #009688; } .DB-page .DB-content .clients-section .voice .voice-content ul.post-client-type li.store{ background: #5aaa3c; } .DB-page .DB-content .clients-section .voice .voice-content ul.post-client-type li.ec{ background: #00bcd4; } .DB-page .DB-content .clients-section .voice .voice-content ul.post-client-type li.outlet{ background: #ba68c8; } .DB-page .DB-content .CS-section{ padding-top: 60px; padding-bottom: 60px; background-color: #F6F8F8; } @media screen and (min-width: 480px){.DB-page .DB-content .CS-section{ padding-top: calc(12.5vw + 0px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .CS-section{ padding-top: 160px; }} @media screen and (min-width: 480px){.DB-page .DB-content .CS-section{ padding-bottom: calc(12.5vw + 0px); }} @media screen and (min-width: 1280px){.DB-page .DB-content .CS-section{ padding-bottom: 160px; }} .DB-page .DB-content .CS-section h3{ color: #1e283c; font-weight: 400; font-size: 16px; line-height: 1.5; margin-bottom: 20px; } @media (min-width: 768px){.DB-page .DB-content .CS-section h3{ text-align: center; font-size: 20px; margin-bottom: 40px; }} .DB-page .DB-content .CS-section .MB{ text-align: center; } @media (min-width: 992px){.DB-page .DB-content .CS-section .MB{ display: none; }} .DB-page .DB-content .CS-section .PC{ display: none; text-align: center; } @media (min-width: 992px){.DB-page .DB-content .CS-section .PC{ display: block; }} .DB-page .DB-content .CS-section .flow{ width: 80%; max-width: 360px; margin-bottom: 30px; } @media (min-width: 768px){.DB-page .DB-content .CS-section .flow{ width: 80%; max-width: 400px; margin-bottom: 60px; }} @media (min-width: 992px){.DB-page .DB-content .CS-section .flow{ max-width: 100%; }} .DB-page .DB-content .CS-section p{ font-size: 14px; line-height: 1.5; } @media (min-width: 768px){.DB-page .DB-content .CS-section p{ text-align: center; font-size: 16px; }} .WS-page .WS-hero{ color: #fff; position: relative; background-image: url("/assets/images/WS-hero-bg.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover; } .WS-page .WS-hero .inner{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: auto; position: relative; padding: 100px 0 40px; min-height: 100vh; } @media (min-width: 768px){.WS-page .WS-hero .inner{ padding: 120px 0 60px; min-height: auto; }} @media (min-width: 992px){.WS-page .WS-hero .inner{ padding: 100px 0 40px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }} @media (min-width: 1200px){.WS-page .WS-hero .inner{ padding: 120px 0 60px; }} .WS-page .WS-hero .text{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 0 16px 40px; } @media (min-width: 768px){.WS-page .WS-hero .text{ padding: 0 16px 60px; }} @media (min-width: 992px){.WS-page .WS-hero .text{ padding: 0; }} @media (min-width: 1200px){.WS-page .WS-hero .text{ padding: 0; }} .WS-page .WS-hero h1{ color: #fff; font-weight: 700; line-height: 1.4; letter-spacing: 2px; margin-top: 0px; margin-bottom: 30px; font-size: calc(1.5vw + 20px); text-align: center; text-shadow: 0 0 10px #5aaa3c; } @media (min-width: 768px){.WS-page .WS-hero h1{ font-size: 48px; margin-bottom: 48px; }} @media (min-width: 992px){.WS-page .WS-hero h1{ font-size: 28px; margin-bottom: 32px; }} @media (min-width: 1200px){.WS-page .WS-hero h1{ font-size: 36px; margin-bottom: 48px; }} @media (min-width: 1440px){.WS-page .WS-hero h1{ font-size: 48px; margin-bottom: 48px; }} .WS-page .WS-hero h1.subcopy{ font-weight: 400; line-height: 2; letter-spacing: 2px; margin-top: 0; margin-bottom: 10px; font-size: calc(1.5vw + 8px); } @media (min-width: 768px){.WS-page .WS-hero h1.subcopy{ font-size: 18px; margin-bottom: 30px; }} @media (min-width: 992px){.WS-page .WS-hero h1.subcopy{ font-size: 16px; margin-bottom: 40px; }} @media (min-width: 1200px){.WS-page .WS-hero h1.subcopy{ font-size: 20px; margin-bottom: 60px; }} .WS-page .WS-hero .logo{ margin: 0 auto 12px; width: 200px; } @media (min-width: 768px){.WS-page .WS-hero .logo{ margin: 0 auto 16px; width: 260px; }} @media (min-width: 992px){.WS-page .WS-hero .logo{ width: 240px; }} @media (min-width: 1200px){.WS-page .WS-hero .logo{ width: 260px; }} @media (min-width: 1440px){.WS-page .WS-hero .logo{ width: 260px; }} .WS-page .WS-hero .logo img{ width: 100%; } .WS-page .WS-hero .btn-cta a.btn-common{ background-color: #1e283c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #1e283c)); background-image: linear-gradient(to right, #fff 50%, #1e283c 50%); background-size: 200% 100%; background-position: right center; display: block; color: #fff; border: none; font-size: 14px; font-weight: 600; margin: 0 auto; padding: 8px 16px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } .WS-page .WS-hero .btn-cta a.btn-common:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.WS-page .WS-hero .btn-cta a.btn-common{ font-size: 16px; padding: 12px 24px; }} @media (min-width: 992px){.WS-page .WS-hero .btn-cta a.btn-common{ font-size: 16px; margin: 0 auto 0; }} .WS-page .WS-hero .btn-cta a.btn-common:hover{ color: #1e283c; } .WS-page .WS-hero .btn-cta a.btn-common i{ font-size: 18px; margin-right: 6px; vertical-align: middle; margin-top: -2px; } @media screen and (min-width: 768px){.WS-page .WS-hero .btn-cta a.btn-common i{ font-size: 18px; margin-right: 8px; }} @media screen and (min-width: 1200px){.WS-page .WS-hero .btn-cta a.btn-common i{ font-size: 20px; margin-right: 8px; }} .WS-page .WS-hero .inquiry{ margin-top: 12px; text-align: center; } @media screen and (min-width: 992px){.WS-page .WS-hero .inquiry{ margin-top: 16px; }} .WS-page .WS-hero .inquiry a{ color: #ffffff; font-size: 14px; } @media screen and (min-width: 992px){.WS-page .WS-hero .inquiry a{ font-size: 16px; }} .WS-page .WS-hero .inquiry a:hover{ opacity: 0.6; } .WS-page .WS-hero figure.mock{ max-width: none; width: 80%; } @media (min-width: 768px){.WS-page .WS-hero figure.mock{ width: 480px; }} @media (min-width: 992px){.WS-page .WS-hero figure.mock{ width: 440px; padding-left: 0px; }} @media (min-width: 1200px){.WS-page .WS-hero figure.mock{ width: 600px; }} .WS-page .WS-hero figure.mock img{ width: 100%; } .WS-page .WS-content ul{ list-style: none; margin: 0; } .WS-page .WS-content li{ margin: 0; } .WS-page .WS-content section h2{ color: #5aaa3c; font-size: 24px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.WS-page .WS-content section h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 48px; }} @media (min-width: 992px){.WS-page .WS-content section h2{ font-size: 40px; letter-spacing: 2px; margin-bottom: 60px; }} .WS-page .WS-content section h2::after{ content: ""; display: block; margin: 16px auto 0; width: 36px; height: 4px; border-radius: 3px; background-color: #5aaa3c; opacity: 0.2; } @media (min-width: 768px){.WS-page .WS-content section h2::after{ width: 48px; margin: 20px auto 0; height: 6px; }} @media (min-width: 992px){.WS-page .WS-content section h2::after{ width: 60px; margin: 24px auto 0; height: 6px; }} .WS-page .WS-content section h3{ letter-spacing: 1px; } .WS-page .WS-content section p{ color: #4b5363; font-size: 15px; line-height: 2; margin-bottom: 2em; } @media (min-width: 768px){.WS-page .WS-content section p{ font-size: 16px; }} @media (min-width: 992px){.WS-page .WS-content section p{ font-size: 18px; }} .WS-page .WS-content section p:last-child{ margin-bottom: 0; } .WS-page .WS-content .overview-section{ padding-top: 30px; padding-bottom: 30px; background-color: #F6F8F8; } @media screen and (min-width: 480px){.WS-page .WS-content .overview-section{ padding-top: calc(8.75vw + -12px); }} @media screen and (min-width: 1280px){.WS-page .WS-content .overview-section{ padding-top: 100px; }} @media screen and (min-width: 480px){.WS-page .WS-content .overview-section{ padding-bottom: calc(8.75vw + -12px); }} @media screen and (min-width: 1280px){.WS-page .WS-content .overview-section{ padding-bottom: 100px; }} .WS-page .WS-content .overview-section .row{ background-repeat: no-repeat; background-position: right -10px bottom 0px; padding-bottom: 20px; } @media (min-width: 768px){.WS-page .WS-content .overview-section .row{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }} @media (min-width: 768px){.WS-page .WS-content .overview-section .row{ background-position: right 0px top 30px; }} .WS-page .WS-content .overview-section .content-graphic{ text-align: center; } .WS-page .WS-content .overview-section .content-graphic img{ width: 70%; max-width: 360px; margin-bottom: 20px; } @media (min-width: 768px){.WS-page .WS-content .overview-section .content-graphic img{ width: 100%; max-width: 100%; margin-bottom: 0px; }} .WS-page .WS-content .overview-section .content-text p{ color: #1e283c; font-weight: 500; font-size: 16px; line-height: 2; padding: 10px 0 0; margin: 0 auto; } @media screen and (min-width: 768px){.WS-page .WS-content .overview-section .content-text p{ font-size: 18px; padding: 20px 0 0; max-width: auto; }} @media screen and (min-width: 992px){.WS-page .WS-content .overview-section .content-text p{ font-size: 20px; padding: 40px 0 0; }} .WS-page .WS-content .overview-section .content-text p a{ color: #00bcd4; } .WS-page .WS-content .overview-section .content-text p a:hover{ color: #2d5dea; } .WS-page .WS-content .case-studies-section{ padding-top: 60px; padding-bottom: 60px; background-color: #ffffff; } @media screen and (min-width: 768px){.WS-page .WS-content .case-studies-section{ padding-top: calc(19.53125vw + -90px); }} @media screen and (min-width: 1280px){.WS-page .WS-content .case-studies-section{ padding-top: 160px; }} @media screen and (min-width: 768px){.WS-page .WS-content .case-studies-section{ padding-bottom: calc(19.53125vw + -90px); }} @media screen and (min-width: 1280px){.WS-page .WS-content .case-studies-section{ padding-bottom: 160px; }} .WS-page .WS-content .case-studies-section h2{ color: #1e283c; font-size: 24px; letter-spacing: 1px; margin: 0 auto 30px; } @media (min-width: 768px){.WS-page .WS-content .case-studies-section h2{ font-size: 28px; margin: 0 auto 60px; }} @media (min-width: 992px){.WS-page .WS-content .case-studies-section h2{ font-size: 36px; letter-spacing: 2px; }} @media (min-width: 1280px){.WS-page .WS-content .case-studies-section h2{ font-size: 40px; }} .WS-page .WS-content .case-studies-section h2::after{ display: none; } .WS-page .WS-content .case-studies-section h2 span{ color: #5aaa3c; } .WS-page .WS-content .merit-section{ padding-top: 60px; padding-bottom: 0px; background-color: #ffffff; } @media screen and (min-width: 768px){.WS-page .WS-content .merit-section{ padding-top: calc(19.53125vw + -90px); }} @media screen and (min-width: 1280px){.WS-page .WS-content .merit-section{ padding-top: 160px; }} @media screen and (min-width: 768px){.WS-page .WS-content .merit-section{ padding-bottom: calc(0vw + 0px); }} @media screen and (min-width: 1280px){.WS-page .WS-content .merit-section{ padding-bottom: 0px; }} .WS-page .WS-content .merit-section h2{ margin-bottom: 30px; } @media (min-width: 992px){.WS-page .WS-content .merit-section h2{ margin-bottom: 100px; }} .WS-page .WS-content .merit-section .row{ padding-bottom: 60px; } @media (min-width: 768px){.WS-page .WS-content .merit-section .row{ padding-bottom: 100px; }} .WS-page .WS-content .merit-section .row .content-graphic{ text-align: center; } .WS-page .WS-content .merit-section .row .content-text{ padding-bottom: 20px; } @media (min-width: 992px){.WS-page .WS-content .merit-section .row .content-text{ padding-bottom: 60px; }} .WS-page .WS-content .merit-section .row .content-text .number{ display: inline-block; color: #5aaa3c; font-size: 14px; font-weight: 700; border-bottom: 3px solid #5aaa3c; padding-bottom: 3px; margin-bottom: 12px; } @media (min-width: 768px){.WS-page .WS-content .merit-section .row .content-text .number{ font-size: 18px; }} .WS-page .WS-content .merit-section .row .content-text h3{ color: #1e283c; font-size: 22px; line-height: 1.5; margin: 0 0 30px; } @media (min-width: 768px){.WS-page .WS-content .merit-section .row .content-text h3{ font-size: 32px; }} @media (min-width: 992px){.WS-page .WS-content .merit-section .row .content-text h3{ font-size: 32px; margin: 0 0 32px; }} @media (min-width: 1200px){.WS-page .WS-content .merit-section .row .content-text h3{ font-size: 36px; }} .WS-page .WS-content .merit-section .row .content-text p{ color: #1e283c; font-size: 14px; margin-bottom: 10px; } @media screen and (min-width: 768px){.WS-page .WS-content .merit-section .row .content-text p{ font-size: 16px; }} @media screen and (min-width: 992px){.WS-page .WS-content .merit-section .row .content-text p{ font-size: 16px; margin-bottom: 0; }} .WS-page .WS-content .merit-section .row .content-graphic{ text-align: center; } .WS-page .WS-content .merit-section .row .content-graphic img{ width: 60%; } @media (min-width: 992px){.WS-page .WS-content .merit-section .row .content-graphic img{ width: 100%; }} .WS-page .WS-content .CS-section{ padding-top: 60px; padding-bottom: 40px; background-color: #F6F8F8; } @media screen and (min-width: 480px){.WS-page .WS-content .CS-section{ padding-top: calc(12.5vw + 0px); }} @media screen and (min-width: 1280px){.WS-page .WS-content .CS-section{ padding-top: 160px; }} @media screen and (min-width: 480px){.WS-page .WS-content .CS-section{ padding-bottom: calc(10vw + -8px); }} @media screen and (min-width: 1280px){.WS-page .WS-content .CS-section{ padding-bottom: 120px; }} .WS-page .WS-content .CS-section h2{ color: #1e283c; } .WS-page .WS-content .CS-section h2 span{ font-size: 18px; } @media (min-width: 768px){.WS-page .WS-content .CS-section h2 span{ font-size: 24px; }} .WS-page .WS-content .CS-section .MB{ text-align: center; } @media (min-width: 992px){.WS-page .WS-content .CS-section .MB{ display: none; }} .WS-page .WS-content .CS-section .PC{ display: none; text-align: center; } @media (min-width: 992px){.WS-page .WS-content .CS-section .PC{ display: block; }} .WS-page .WS-content .CS-section .flow{ width: 80%; max-width: 360px; margin-bottom: 30px; } @media (min-width: 768px){.WS-page .WS-content .CS-section .flow{ width: 80%; max-width: 400px; margin-bottom: 40px; }} @media (min-width: 992px){.WS-page .WS-content .CS-section .flow{ max-width: 100%; }} .WS-page .WS-content .CS-section p{ font-size: 14px; line-height: 1.5; margin-bottom: 60px !important; } @media (min-width: 768px){.WS-page .WS-content .CS-section p{ text-align: center; margin-bottom: 120px !important; }} .WS-page .WS-content .CS-section .CS-member{ padding: 0 0 10px; text-align: center; } @media (min-width: 768px){.WS-page .WS-content .CS-section .CS-member{ padding: 0 0 60px; }} .WS-page .WS-content .CS-section .CS-member h4{ color: #1e283c; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: 0 auto 30px; padding-bottom: 4px; border-bottom: 3px solid #1e283c; font-size: 18px; } @media (min-width: 768px){.WS-page .WS-content .CS-section .CS-member h4{ margin: 0 auto 60px; border-bottom: 4px solid #1e283c; font-size: 28px; }} .WS-page .WS-content .CS-section .CS-member img{ width: 80%; margin-bottom: 20px; } @media (min-width: 768px){.WS-page .WS-content .CS-section .CS-member img{ width: 80%; margin-bottom: 40px; }} @media (min-width: 992px){.WS-page .WS-content .CS-section .CS-member img{ width: 100%; margin-bottom: 0px; }} .SA-page .SA-hero{ color: #ffffff; position: relative; overflow: hidden; } .SA-page .SA-hero .hero-video{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; } .SA-page .SA-hero .mask{ background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.6)), color-stop(20%, rgba(255, 255, 255, 0.4)), color-stop(40%, rgba(255, 255, 255, 0.4)), to(rgba(255, 255, 255, 0))); background: linear-gradient(-180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 20%, rgba(255, 255, 255, 0.4) 40%, rgba(255, 255, 255, 0) 100%); min-height: 100vh; position: relative; z-index: 1; backdrop-filter: blur(1px); -webkit-backdrop-filter: blur(1px); } @media (min-width: 992px){.SA-page .SA-hero .mask{ background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(20%, rgba(255, 255, 255, 0.6)), color-stop(80%, rgba(255, 255, 255, 0.6)), to(rgba(255, 255, 255, 0))); background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 20%, rgba(255, 255, 255, 0.6) 80%, rgba(255, 255, 255, 0) 100%); min-height: auto; }} .SA-page .SA-hero .mask_header{ background: -webkit-gradient(linear, left top, left bottom, from(rgba(10, 20, 30, 0.4)), color-stop(10%, rgba(10, 20, 30, 0)), to(rgba(10, 20, 30, 0))); background: linear-gradient(-180deg, rgba(10, 20, 30, 0.4) 0%, rgba(10, 20, 30, 0) 10%, rgba(10, 20, 30, 0) 100%); min-height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 2; } @media (min-width: 992px){.SA-page .SA-hero .mask_header{ background: -webkit-gradient(linear, left top, left bottom, from(rgba(10, 20, 30, 0.4)), color-stop(20%, rgba(10, 20, 30, 0)), to(rgba(10, 20, 30, 0))); background: linear-gradient(-180deg, rgba(10, 20, 30, 0.4) 0%, rgba(10, 20, 30, 0) 20%, rgba(10, 20, 30, 0) 100%); min-height: auto; display: block; }} .SA-page .SA-hero .inner{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: 0 auto; position: relative; padding: 40px 0 20px; } @media (min-width: 768px){.SA-page .SA-hero .inner{ padding: 40px 0 40px; }} @media (min-width: 992px){.SA-page .SA-hero .inner{ padding: 100px 0 20px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }} @media (min-width: 1200px){.SA-page .SA-hero .inner{ padding: 120px 0 40px; }} .SA-page .SA-hero .text{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 20px 15px 40px; } @media (min-width: 768px){.SA-page .SA-hero .text{ padding: 40px 15px 60px; }} @media (min-width: 992px){.SA-page .SA-hero .text{ padding: 0; }} @media (min-width: 1200px){.SA-page .SA-hero .text{ padding: 0; }} .SA-page .SA-hero h1{ color: #1e283c; font-weight: 700; line-height: 1.3; letter-spacing: 2px; margin-top: 0px; margin-bottom: 24px; font-size: calc(1.5vw + 16px); text-align: center; text-shadow: 0 4px 8px rgba(30, 40, 60, 0.1); } @media (min-width: 768px){.SA-page .SA-hero h1{ font-size: 32px; margin-bottom: 40px; }} @media (min-width: 992px){.SA-page .SA-hero h1{ font-size: 24px; margin-bottom: 64px; text-align: left; }} @media (min-width: 1200px){.SA-page .SA-hero h1{ font-size: 32px; margin-bottom: 80px; }} .SA-page .SA-hero h1 b{ display: block; font-weight: 800; font-size: calc(1.5vw + 24px); line-height: 1.3; margin-bottom: 8px; } @media (min-width: 768px){.SA-page .SA-hero h1 b{ font-size: 40px; }} @media (min-width: 992px){.SA-page .SA-hero h1 b{ font-size: 32px; }} @media (min-width: 1200px){.SA-page .SA-hero h1 b{ font-size: 40px; }} .SA-page .SA-hero h1 b span{ font-weight: 300; } .SA-page .SA-hero h1 strong{ font-size: calc(1.5vw + 28px); } @media (min-width: 768px){.SA-page .SA-hero h1 strong{ font-size: 56px; }} @media (min-width: 992px){.SA-page .SA-hero h1 strong{ font-size: 40px; }} @media (min-width: 1200px){.SA-page .SA-hero h1 strong{ font-size: 48px; }} .SA-page .SA-hero .logo{ margin: 0 auto 24px; width: 220px; } @media (min-width: 768px){.SA-page .SA-hero .logo{ margin: 0 auto 40px; width: 320px; }} @media (min-width: 992px){.SA-page .SA-hero .logo{ margin: 0 0 32px; width: 260px; }} @media (min-width: 1200px){.SA-page .SA-hero .logo{ margin: 0 0 40px; width: 320px; }} .SA-page .SA-hero .logo img{ width: 100%; -webkit-filter: drop-shadow(0 4px 8px rgba(30, 40, 60, 0.2)); filter: drop-shadow(0 4px 8px rgba(30, 40, 60, 0.2)); } .SA-page .SA-hero .btn-cta{ text-align: center; } @media (min-width: 992px){.SA-page .SA-hero .btn-cta{ text-align: left; }} .SA-page .SA-hero .btn-cta a{ display: inline-block; padding: 12px 20px 10px; color: #ffffff; border-radius: 100px; font-size: 14px; font-weight: 600; text-decoration: none; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; -webkit-box-shadow: 0 4px 8px rgba(30, 40, 60, 0.2); box-shadow: 0 4px 8px rgba(30, 40, 60, 0.2); position: relative; z-index: 0; -webkit-transition: -webkit-box-shadow 0.3s ease, -webkit-transform 0.3s ease; transition: -webkit-box-shadow 0.3s ease, -webkit-transform 0.3s ease; transition: box-shadow 0.3s ease, transform 0.3s ease; transition: box-shadow 0.3s ease, transform 0.3s ease, -webkit-box-shadow 0.3s ease, -webkit-transform 0.3s ease; } @media (min-width: 768px){.SA-page .SA-hero .btn-cta a{ padding: 17px 24px 13px; font-size: 16px; }} @media (min-width: 992px){.SA-page .SA-hero .btn-cta a{ padding: 13px 20px 9px; font-size: 16px; }} @media (min-width: 1200px){.SA-page .SA-hero .btn-cta a{ padding: 15px 28px 11px; font-size: 18px; }} .SA-page .SA-hero .btn-cta a::before{ content: ''; position: absolute; inset: 0; border-radius: 100px; background: linear-gradient(120deg, #fac800 0%, #fa7800 50%, #ff2878 100%); z-index: -1; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; opacity: 1; } .SA-page .SA-hero .btn-cta a::after{ content: ''; position: absolute; inset: 0; border-radius: 100px; background: linear-gradient(120deg, #ff2878 0%, #fa7800 50%, #fac800 100%); z-index: -1; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; opacity: 0; } .SA-page .SA-hero .btn-cta a:hover{ -webkit-box-shadow: 0 2px 4px rgba(30, 40, 60, 0.2); box-shadow: 0 2px 4px rgba(30, 40, 60, 0.2); } .SA-page .SA-hero .btn-cta a:hover::before{ opacity: 0; } .SA-page .SA-hero .btn-cta a:hover::after{ opacity: 1; } .SA-page .SA-hero .btn-cta a i{ vertical-align: middle; font-size: 16px; margin-right: 8px; margin-top: -2px; } @media (min-width: 768px){.SA-page .SA-hero .btn-cta a i{ font-size: 20px; margin-right: 8px; margin-top: -2px; }} @media (min-width: 992px){.SA-page .SA-hero .btn-cta a i{ font-size: 20px; margin-right: 8px; margin-top: -2px; }} @media (min-width: 1200px){.SA-page .SA-hero .btn-cta a i{ font-size: 22px; margin-right: 12px; margin-top: -3px; }} .SA-page .SA-hero .mock{ text-align: center; width: 100%; max-width: 200px; } @media (min-width: 768px){.SA-page .SA-hero .mock{ max-width: 400px; }} @media (min-width: 992px){.SA-page .SA-hero .mock{ margin-top: 0; width: 300px; }} @media (min-width: 1200px){.SA-page .SA-hero .mock{ width: 400px; }} .SA-page .SA-hero .mock img{ width: 100%; height: auto; -webkit-filter: drop-shadow(0 12px 16px rgba(30, 40, 60, 0.2)); filter: drop-shadow(0 12px 16px rgba(30, 40, 60, 0.2)); } .SA-page .SA-content{ background-color: #ffffff; } .SA-page .SA-content h2{ text-align: center; font-size: 24px; font-weight: 700; line-height: 1.5; color: #1e283c; margin-bottom: 32px; letter-spacing: 1.4px; } @media (min-width: 768px){.SA-page .SA-content h2{ font-size: 28px; letter-spacing: 1.4px; margin-bottom: 36px; }} @media (min-width: 992px){.SA-page .SA-content h2{ font-size: 32px; letter-spacing: 1.6px; margin-bottom: 36px; }} @media (min-width: 1200px){.SA-page .SA-content h2{ font-size: 36px; letter-spacing: 1.8px; margin-bottom: 36px; }} .SA-page .SA-content h2::after{ content: ''; display: block; width: 48px; height: 6px; background-color: #ff7800; border-radius: 20px; margin: 12px auto 0; opacity: 0.3; } @media (min-width: 992px){.SA-page .SA-content h2::after{ margin: 16px auto 0; width: 60px; }} .SA-page .SA-content .overview-section{ padding: 60px 0; } @media (min-width: 768px){.SA-page .SA-content .overview-section{ padding: 80px 0; }} @media (min-width: 1200px){.SA-page .SA-content .overview-section{ padding: 120px 0; }} .SA-page .SA-content .overview-section .lead{ font-size: 16px; color: #343d4f; line-height: 1.8; margin-bottom: 24px; } @media (min-width: 768px){.SA-page .SA-content .overview-section .lead{ text-align: center; }} @media (min-width: 992px){.SA-page .SA-content .overview-section .lead{ font-size: 16px; margin-bottom: 32px; }} @media (min-width: 1200px){.SA-page .SA-content .overview-section .lead{ font-size: 18px; margin-bottom: 32px; }} .SA-page .SA-content .overview-section .pic{ text-align: center; margin: 0; } .SA-page .SA-content .overview-section .pic img{ max-width: 100%; height: auto; } .SA-page .SA-content .problem-section{ background-color: #f4f4f5; padding: 60px 0 24px; } @media (min-width: 768px){.SA-page .SA-content .problem-section{ padding: 80px 0; }} @media (min-width: 1200px){.SA-page .SA-content .problem-section{ padding: 120px 0; }} .SA-page .SA-content .problem-section h2::after{ display: none; } .SA-page .SA-content .problem-section h2 .highlight{ color: #ff7800; background-color: transparent; } .SA-page .SA-content .problem-section .problem-item{ margin-bottom: 32px; } @media (min-width: 768px){.SA-page .SA-content .problem-section .problem-item{ margin-bottom: 0; }} .SA-page .SA-content .problem-section .problem-item .problem-pic{ text-align: center; margin-bottom: 16px; } @media (min-width: 768px){.SA-page .SA-content .problem-section .problem-item .problem-pic{ margin-bottom: 24px; }} .SA-page .SA-content .problem-section .problem-item .problem-pic img{ width: 60%; height: auto; } @media (min-width: 768px){.SA-page .SA-content .problem-section .problem-item .problem-pic img{ width: 100%; }} @media (min-width: 992px){.SA-page .SA-content .problem-section .problem-item .problem-pic img{ width: 80%; }} .SA-page .SA-content .problem-section .problem-item .problem-text{ text-align: center; font-size: 16px; color: #343d4f; line-height: 1.6; margin: 0; } @media (min-width: 768px){.SA-page .SA-content .problem-section .problem-item .problem-text{ font-size: 14px; }} @media (min-width: 992px){.SA-page .SA-content .problem-section .problem-item .problem-text{ font-size: 16px; }} @media (min-width: 1200px){.SA-page .SA-content .problem-section .problem-item .problem-text{ font-size: 18px; }} .SA-page .SA-content .point-section{ padding: 60px 0 16px; } @media (min-width: 768px){.SA-page .SA-content .point-section{ padding: 80px 0 32px; }} @media (min-width: 1200px){.SA-page .SA-content .point-section{ padding: 120px 0; }} .SA-page .SA-content .point-section h2{ text-align: center; font-size: 32px; font-weight: 700; line-height: 1.5; color: #1e283c; margin-bottom: 32px; letter-spacing: 1.4px; } @media (min-width: 768px){.SA-page .SA-content .point-section h2{ font-size: 40px; letter-spacing: 1.4px; margin-bottom: 60px; }} @media (min-width: 992px){.SA-page .SA-content .point-section h2{ font-size: 48px; letter-spacing: 1.6px; margin-bottom: 60px; }} @media (min-width: 1200px){.SA-page .SA-content .point-section h2{ font-size: 56px; letter-spacing: 1.8px; margin-bottom: 60px; }} .SA-page .SA-content .point-section h2 .sub-title{ display: block; font-size: 16px; font-weight: 600; margin-bottom: 4px; letter-spacing: 0px; } @media (min-width: 768px){.SA-page .SA-content .point-section h2 .sub-title{ font-size: 18px; }} @media (min-width: 992px){.SA-page .SA-content .point-section h2 .sub-title{ font-size: 20px; }} .SA-page .SA-content .point-section .point-item{ margin-bottom: 60px; } @media (min-width: 992px){.SA-page .SA-content .point-section .point-item{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }} @media (min-width: 1200px){.SA-page .SA-content .point-section .point-item{ margin-bottom: 60px; }} @media (min-width: 1200px){.SA-page .SA-content .point-section .point-item .content-text{ -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }} .SA-page .SA-content .point-section .point-item .content-text .point-badge{ display: inline-block; background: linear-gradient(116.8deg, #fac800 0%, #fa7800 48.8%, #ff2878 98.6%); color: #ffffff; font-weight: 700; padding: 4px 12px; border-radius: 20px; font-size: 12px; margin-bottom: 12px; } @media (min-width: 768px){.SA-page .SA-content .point-section .point-item .content-text .point-badge{ margin-bottom: 12px; font-size: 14px; }} @media (min-width: 992px){.SA-page .SA-content .point-section .point-item .content-text .point-badge{ margin-bottom: 16px; font-size: 16px; }} .SA-page .SA-content .point-section .point-item .content-text h3{ font-size: 24px; font-weight: 700; color: #1e283c; line-height: 1.4; margin: 0 0 16px; } @media (min-width: 768px){.SA-page .SA-content .point-section .point-item .content-text h3{ font-size: 32px; margin-bottom: 16px; }} @media (min-width: 992px){.SA-page .SA-content .point-section .point-item .content-text h3{ font-size: 36px; margin-bottom: 20px; }} @media (min-width: 1200px){.SA-page .SA-content .point-section .point-item .content-text h3{ font-size: 40px; margin-bottom: 20px; }} .SA-page .SA-content .point-section .point-item .content-text p{ font-size: 14px; color: #343d4f; margin: 0; } @media (min-width: 768px){.SA-page .SA-content .point-section .point-item .content-text p{ font-size: 16px; }} .SA-page .SA-content .point-section .point-item .content-graphic{ margin-top: 24px; } @media (min-width: 992px){.SA-page .SA-content .point-section .point-item .content-graphic{ margin-top: 0; }} @media (min-width: 1200px){.SA-page .SA-content .point-section .point-item .content-graphic{ -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }} .SA-page .SA-content .point-section .point-item .content-graphic .point-card{ width: 100%; margin: 0 auto; background-color: #ffffff; border-radius: 8px; overflow: hidden; -webkit-box-shadow: 0 0 20px rgba(30, 60, 140, 0.2); box-shadow: 0 0 20px rgba(30, 60, 140, 0.2); padding: 16px; } @media (min-width: 768px){.SA-page .SA-content .point-section .point-item .content-graphic .point-card{ width: 80%; }} @media (min-width: 992px){.SA-page .SA-content .point-section .point-item .content-graphic .point-card{ width: 100%; }} .SA-page .SA-content .point-section .point-item .content-graphic .point-card img{ width: 100%; height: auto; display: block; margin: 0 auto; } .SA-page .SA-content .flow-section{ background-color: #f4f4f5; padding: 60px 0; } @media (min-width: 768px){.SA-page .SA-content .flow-section{ padding: 80px 0; }} @media (min-width: 1200px){.SA-page .SA-content .flow-section{ padding: 120px 0; }} .SA-page .SA-content .flow-section .flow-pic{ text-align: center; margin: 0 0 30px; } @media (min-width: 992px){.SA-page .SA-content .flow-section .flow-pic{ margin-bottom: 40px; }} .SA-page .SA-content .flow-section .flow-pic img{ max-width: 100%; height: auto; } .SA-page .SA-content .flow-section .flow-caption{ text-align: center; font-size: 16px; color: #343d4f; line-height: 1.8; margin: 0; } @media (min-width: 992px){.SA-page .SA-content .flow-section .flow-caption{ font-size: 16px; }} .SPL-page .SPL-hero{ color: #fff; position: relative; background-image: url("/assets/images/SPL-hero-bg.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover; } .SPL-page .SPL-hero .inner{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: auto; position: relative; padding: 100px 0 40px; min-height: 100vh; } @media (min-width: 768px){.SPL-page .SPL-hero .inner{ padding: 120px 0 60px; min-height: auto; }} @media (min-width: 992px){.SPL-page .SPL-hero .inner{ padding: 100px 0 40px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }} @media (min-width: 1200px){.SPL-page .SPL-hero .inner{ padding: 120px 0 60px; }} .SPL-page .SPL-hero .text{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 0 16px 40px; } @media (min-width: 768px){.SPL-page .SPL-hero .text{ padding: 0 16px 60px; }} @media (min-width: 992px){.SPL-page .SPL-hero .text{ padding: 0; }} @media (min-width: 1200px){.SPL-page .SPL-hero .text{ padding: 0; }} .SPL-page .SPL-hero h1{ color: #fff; font-weight: 700; line-height: 1.4; letter-spacing: 2px; margin-top: 0px; margin-bottom: 30px; font-size: calc(3vw + 24px); text-align: center; text-shadow: 0 0 10px #b71c1c; } @media (min-width: 768px){.SPL-page .SPL-hero h1{ font-size: 48px; margin-bottom: 48px; }} @media (min-width: 992px){.SPL-page .SPL-hero h1{ font-size: 36px; margin-bottom: 32px; }} @media (min-width: 1200px){.SPL-page .SPL-hero h1{ font-size: 40px; margin-bottom: 48px; }} @media (min-width: 1440px){.SPL-page .SPL-hero h1{ font-size: 48px; margin-bottom: 48px; }} .SPL-page .SPL-hero h1.subcopy{ font-weight: 400; line-height: 2; letter-spacing: 2px; margin-top: 0; margin-bottom: 10px; font-size: calc(1.5vw + 8px); } @media (min-width: 768px){.SPL-page .SPL-hero h1.subcopy{ font-size: 18px; margin-bottom: 30px; }} @media (min-width: 992px){.SPL-page .SPL-hero h1.subcopy{ font-size: 16px; margin-bottom: 40px; }} @media (min-width: 1200px){.SPL-page .SPL-hero h1.subcopy{ font-size: 20px; margin-bottom: 60px; }} .SPL-page .SPL-hero .logo{ margin: 0 auto 12px; width: 200px; } @media (min-width: 768px){.SPL-page .SPL-hero .logo{ margin: 0 auto 16px; width: 260px; }} @media (min-width: 992px){.SPL-page .SPL-hero .logo{ width: 240px; }} @media (min-width: 1200px){.SPL-page .SPL-hero .logo{ width: 260px; }} @media (min-width: 1440px){.SPL-page .SPL-hero .logo{ width: 260px; }} .SPL-page .SPL-hero .logo img{ width: 100%; } .SPL-page .SPL-hero .btn-cta a.btn-common{ background-color: #1e283c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, #1e283c)); background-image: linear-gradient(to right, #fff 50%, #1e283c 50%); background-size: 200% 100%; background-position: right center; display: block; color: #fff; border: none; font-size: 14px; font-weight: 600; margin: 0 auto; padding: 8px 16px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } .SPL-page .SPL-hero .btn-cta a.btn-common:hover{ background-color: #fff; background-position: left center; } @media (min-width: 768px){.SPL-page .SPL-hero .btn-cta a.btn-common{ font-size: 16px; padding: 12px 24px; }} @media (min-width: 992px){.SPL-page .SPL-hero .btn-cta a.btn-common{ font-size: 16px; margin: 0 auto 0; }} .SPL-page .SPL-hero .btn-cta a.btn-common:hover{ color: #1e283c; } .SPL-page .SPL-hero .btn-cta a.btn-common i{ font-size: 18px; margin-right: 6px; vertical-align: middle; margin-top: -2px; } @media screen and (min-width: 768px){.SPL-page .SPL-hero .btn-cta a.btn-common i{ font-size: 18px; margin-right: 8px; }} @media screen and (min-width: 1200px){.SPL-page .SPL-hero .btn-cta a.btn-common i{ font-size: 20px; margin-right: 8px; }} .SPL-page .SPL-hero .inquiry{ margin-top: 12px; text-align: center; } @media screen and (min-width: 992px){.SPL-page .SPL-hero .inquiry{ margin-top: 16px; }} .SPL-page .SPL-hero .inquiry a{ color: #ffffff; font-size: 14px; } @media screen and (min-width: 992px){.SPL-page .SPL-hero .inquiry a{ font-size: 16px; }} .SPL-page .SPL-hero .inquiry a:hover{ opacity: 0.6; } .SPL-page .SPL-hero figure.mock{ max-width: none; width: 80%; } @media (min-width: 768px){.SPL-page .SPL-hero figure.mock{ width: 480px; }} @media (min-width: 992px){.SPL-page .SPL-hero figure.mock{ width: 440px; padding-left: 0px; }} @media (min-width: 1200px){.SPL-page .SPL-hero figure.mock{ width: 600px; }} .SPL-page .SPL-hero figure.mock img{ width: 100%; } .SPL-page .SPL-content ul{ list-style: none; margin: 0; } .SPL-page .SPL-content li{ margin: 0; } .SPL-page .SPL-content section h2{ color: #f03c3c; font-size: 24px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.SPL-page .SPL-content section h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 48px; }} @media (min-width: 992px){.SPL-page .SPL-content section h2{ font-size: 36px; letter-spacing: 2px; margin-bottom: 60px; }} @media (min-width: 1200px){.SPL-page .SPL-content section h2{ font-size: 40px; letter-spacing: 3px; margin-bottom: 60px; }} .SPL-page .SPL-content section h2::after{ content: ""; display: block; margin: 16px auto 0; width: 40px; height: 4px; border-radius: 3px; background-color: #f03c3c; opacity: 0.2; } @media (min-width: 768px){.SPL-page .SPL-content section h2::after{ width: 60px; margin: 20px auto 0; height: 6px; }} @media (min-width: 992px){.SPL-page .SPL-content section h2::after{ width: 80px; margin: 24px auto 0; height: 6px; }} .SPL-page .SPL-content section h3{ letter-spacing: 1px; } .SPL-page .SPL-content section p{ color: #4b5363; font-size: 15px; line-height: 2; margin-bottom: 2em; } @media (min-width: 768px){.SPL-page .SPL-content section p{ font-size: 16px; }} @media (min-width: 992px){.SPL-page .SPL-content section p{ font-size: 18px; }} .SPL-page .SPL-content section p:last-child{ margin-bottom: 0; } .SPL-page .SPL-content .overview-section{ padding-top: 60px; padding-bottom: 60px; background-color: #f4f4f5; } @media screen and (min-width: 768px){.SPL-page .SPL-content .overview-section{ padding-top: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .overview-section{ padding-top: 80px; }} @media screen and (min-width: 768px){.SPL-page .SPL-content .overview-section{ padding-bottom: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .overview-section{ padding-bottom: 80px; }} .SPL-page .SPL-content .overview-section .lead{ color: #1e283c; text-align: center; font-weight: 500; font-size: 16px; line-height: 1.8; margin-bottom: 30px; } @media (min-width: 768px){.SPL-page .SPL-content .overview-section .lead{ font-size: 20px; }} @media (min-width: 992px){.SPL-page .SPL-content .overview-section .lead{ font-size: 24px; }} .SPL-page .SPL-content .overview-section .row{ background-repeat: no-repeat; background-position: right bottom; } @media (min-width: 768px){.SPL-page .SPL-content .overview-section .row{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }} @media (min-width: 768px){.SPL-page .SPL-content .overview-section .row{ background-position: right 0px top 30px; }} .SPL-page .SPL-content .overview-section .content-graphic{ text-align: center; } .SPL-page .SPL-content .overview-section .content-graphic img{ width: 80%; max-width: 360px; padding-bottom: 20px; } @media (min-width: 768px){.SPL-page .SPL-content .overview-section .content-graphic img{ width: 100%; max-width: 100%; padding-bottom: 0px; }} .SPL-page .SPL-content .overview-section .content-text p{ color: #1e283c; font-size: 12px; line-height: 2; text-align: center; padding: 10px 0 0; } @media screen and (min-width: 768px){.SPL-page .SPL-content .overview-section .content-text p{ text-align: left; font-size: 16px; padding: 20px 0 0; }} @media screen and (min-width: 992px){.SPL-page .SPL-content .overview-section .content-text p{ font-size: 18px; padding: 0 0 0 20px; }} .SPL-page .SPL-content .clients-section{ padding-top: 60px; padding-bottom: 60px; background-color: #ffffff; } @media screen and (min-width: 480px){.SPL-page .SPL-content .clients-section{ padding-top: calc(2.5vw + 48px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .clients-section{ padding-top: 80px; }} @media screen and (min-width: 480px){.SPL-page .SPL-content .clients-section{ padding-bottom: calc(2.5vw + 48px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .clients-section{ padding-bottom: 80px; }} .SPL-page .SPL-content .clients-section .voice{ display: block; max-width: 408px; padding: 24px; border-radius: 8px; -webkit-box-shadow: 0 0 10px rgba(30, 60, 140, 0.15); box-shadow: 0 0 10px rgba(30, 60, 140, 0.15); margin: 0 auto 30px; } @media (min-width: 768px){.SPL-page .SPL-content .clients-section .voice{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; max-width: 100%; }} .SPL-page .SPL-content .clients-section .voice:hover{ -webkit-box-shadow: 0 10px 20px rgba(30, 60, 140, 0.2); box-shadow: 0 10px 20px rgba(30, 60, 140, 0.2); } .SPL-page .SPL-content .clients-section .voice .voice-content{ -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: left; padding-top: 24px; } @media (min-width: 768px){.SPL-page .SPL-content .clients-section .voice .voice-content{ padding-left: 24px; padding-top: 0; }} .SPL-page .SPL-content .clients-section .voice .voice-content .voice-title{ color: #1e283c; font-weight: 700; font-size: 16px; line-height: 1.8; margin-bottom: 18px; } @media (min-width: 992px){.SPL-page .SPL-content .clients-section .voice .voice-content .voice-title{ font-size: 18px; margin-bottom: 24px; }} .SPL-page .SPL-content .clients-section .voice .voice-content .post-client{ color: #787e8a; font-weight: 500; font-size: 14px; margin-bottom: 0px; } .SPL-page .SPL-content .clients-section .voice .voice-content .post-client-items{ color: #787e8a; font-size: 12px; margin-bottom: 6px; } .SPL-page .SPL-content .clients-section .voice .voice-content ul.post-client-type{ color: #ffffff; font-size: 12px; margin: 0; } .SPL-page .SPL-content .clients-section .voice .voice-content ul.post-client-type li{ display: inline-block; padding: 4px 12px; margin: 0 4px 4px 0; } .SPL-page .SPL-content .clients-section .voice .voice-content ul.post-client-type li.retail{ background: #2d5dea; } .SPL-page .SPL-content .clients-section .voice .voice-content ul.post-client-type li.wholesale{ background: #009688; } .SPL-page .SPL-content .clients-section .voice .voice-content ul.post-client-type li.store{ background: #5aaa3c; } .SPL-page .SPL-content .clients-section .voice .voice-content ul.post-client-type li.ec{ background: #00bcd4; } .SPL-page .SPL-content .clients-section .voice .voice-content ul.post-client-type li.outlet{ background: #ba68c8; } .SPL-page .SPL-content .problem-section{ padding-top: 60px; padding-bottom: 40px; text-align: center; background-color: #f4f4f5; } @media screen and (min-width: 768px){.SPL-page .SPL-content .problem-section{ padding-top: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .problem-section{ padding-top: 80px; }} @media screen and (min-width: 768px){.SPL-page .SPL-content .problem-section{ padding-bottom: calc(7.8125vw + -20px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .problem-section{ padding-bottom: 80px; }} @media (max-width: 767px){.SPL-page .SPL-content .problem-section{ padding-bottom: 0px; }} .SPL-page .SPL-content .problem-section img{ width: 50%; max-width: 280px; } @media (min-width: 768px){.SPL-page .SPL-content .problem-section img{ width: 100%; }} .SPL-page .SPL-content .problem-section img.arrow{ width: 32px; } .SPL-page .SPL-content .problem-section h2{ color: #1e283c; font-size: 20px; letter-spacing: 1px; margin: 0 auto 30px; } @media (min-width: 768px){.SPL-page .SPL-content .problem-section h2{ font-size: 24px; margin: 0 auto 40px; }} @media (min-width: 992px){.SPL-page .SPL-content .problem-section h2{ font-size: 28px; letter-spacing: 2px; }} @media (min-width: 1280px){.SPL-page .SPL-content .problem-section h2{ font-size: 32px; }} .SPL-page .SPL-content .problem-section h2::after{ display: none; } .SPL-page .SPL-content .problem-section h2 span{ color: #f03c3c; } .SPL-page .SPL-content .problem-section p{ color: #1e283c; font-weight: 600; font-size: 16px; line-height: 1.5; padding: 8px 0 8px; margin: 0; } @media (min-width: 992px){.SPL-page .SPL-content .problem-section p{ font-size: 20px; padding: 20px 0 8px; }} .SPL-page .SPL-content .problem-section p.result{ font-weight: 400; padding: 8px 0 60px; } @media (min-width: 768px){.SPL-page .SPL-content .problem-section p.result{ padding: 8px 0; }} .SPL-page .SPL-content .merit-section{ padding-top: 60px; padding-bottom: 60px; background-color: #ffffff; } @media screen and (min-width: 768px){.SPL-page .SPL-content .merit-section{ padding-top: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .merit-section{ padding-top: 80px; }} @media screen and (min-width: 768px){.SPL-page .SPL-content .merit-section{ padding-bottom: calc(3.90625vw + 30px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .merit-section{ padding-bottom: 80px; }} .SPL-page .SPL-content .merit-section .row .content-graphic{ text-align: center; } .SPL-page .SPL-content .merit-section .row .content-graphic img{ margin-bottom: 40px; } @media (min-width: 768px){.SPL-page .SPL-content .merit-section .row .content-graphic img{ margin-bottom: 60px; }} .SPL-page .SPL-content .merit-section .row .content-text{ padding-top: 20px; } .SPL-page .SPL-content .merit-section .row .content-text .number{ display: inline-block; color: #f03c3c; font-size: 14px; font-weight: 700; border-bottom: 3px solid #f03c3c; padding-bottom: 3px; margin-bottom: 12px; } @media (min-width: 768px){.SPL-page .SPL-content .merit-section .row .content-text .number{ font-size: 18px; }} .SPL-page .SPL-content .merit-section .row .content-text h3{ color: #1e283c; font-size: 20px; line-height: 1.5; margin: 0 0 10px; } @media (min-width: 768px){.SPL-page .SPL-content .merit-section .row .content-text h3{ font-size: 24px; }} @media (min-width: 992px){.SPL-page .SPL-content .merit-section .row .content-text h3{ font-size: 28px; margin: 0 0 30px; }} @media (min-width: 1200px){.SPL-page .SPL-content .merit-section .row .content-text h3{ font-size: 32px; }} .SPL-page .SPL-content .merit-section .row .content-text p{ color: #1e283c; font-size: 14px; margin-bottom: 10px; } @media screen and (min-width: 768px){.SPL-page .SPL-content .merit-section .row .content-text p{ font-size: 16px; }} @media screen and (min-width: 992px){.SPL-page .SPL-content .merit-section .row .content-text p{ font-size: 16px; margin-bottom: 0; }} .SPL-page .SPL-content .merit-section a.CTA-btn{ display: block; color: #00bcd4; text-align: center; font-weight: 700; background-color: transparent; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #00bcd4), color-stop(50%, transparent)); background-image: linear-gradient(to right, #00bcd4 50%, transparent 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #00bcd4; font-size: 16px; width: 200px; padding: 16px; border-radius: 60px; margin: 0 auto; } .SPL-page .SPL-content .merit-section a.CTA-btn:hover{ background-color: #00bcd4; background-position: left center; } .SPL-page .SPL-content .merit-section a.CTA-btn:hover{ color: #ffffff; } @media (min-width: 768px){.SPL-page .SPL-content .merit-section a.CTA-btn{ margin: 40px auto 0; font-size: 20px; width: 240px; padding: 20px; }} @media (min-width: 992px){.SPL-page .SPL-content .merit-section a.CTA-btn{ font-size: 22px; width: 280px; padding: 22px; }} @media (min-width: 1200px){.SPL-page .SPL-content .merit-section a.CTA-btn{ font-size: 24px; width: 300px; padding: 24px; }} .SPL-page .SPL-content .CS-section{ padding-top: 40px; padding-bottom: 20px; background-color: #ffffff; } @media screen and (min-width: 480px){.SPL-page .SPL-content .CS-section{ padding-top: calc(5vw + 16px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .CS-section{ padding-top: 80px; }} @media screen and (min-width: 480px){.SPL-page .SPL-content .CS-section{ padding-bottom: calc(7.5vw + -16px); }} @media screen and (min-width: 1280px){.SPL-page .SPL-content .CS-section{ padding-bottom: 80px; }} .SPL-page .SPL-content .CS-section h2{ color: #1e283c; } .SPL-page .SPL-content .CS-section h2::after{ background-color: #1E82E6; } .SPL-page .SPL-content .CS-section h3{ color: #1e283c; font-weight: 500; font-size: 16px; line-height: 1.5; margin-bottom: 20px; } @media (min-width: 768px){.SPL-page .SPL-content .CS-section h3{ text-align: center; font-size: 20px; margin-bottom: 40px; }} .SPL-page .SPL-content .CS-section .MB{ text-align: center; } @media (min-width: 992px){.SPL-page .SPL-content .CS-section .MB{ display: none; }} .SPL-page .SPL-content .CS-section .PC{ display: none; } @media (min-width: 992px){.SPL-page .SPL-content .CS-section .PC{ display: block; }} .SPL-page .SPL-content .CS-section .flow-MB{ width: 80%; margin-bottom: 20px; } @media (min-width: 768px){.SPL-page .SPL-content .CS-section .flow-MB{ width: 60%; margin-bottom: 30px; }} .SPL-page .SPL-content .CS-section .flow-PC{ width: 100%; margin-bottom: 20px; } @media (min-width: 768px){.SPL-page .SPL-content .CS-section .flow-PC{ margin-bottom: 30px; }} .SPL-page .SPL-content .CS-section p{ font-size: 14px; line-height: 1.5; margin-bottom: 60px !important; } @media (min-width: 768px){.SPL-page .SPL-content .CS-section p{ text-align: center; margin-bottom: 120px !important; }} .SPL-page .SPL-content .CS-section .CS-member{ padding: 0 0 10px; text-align: center; } @media (min-width: 768px){.SPL-page .SPL-content .CS-section .CS-member{ padding: 0 0 60px; }} .SPL-page .SPL-content .CS-section .CS-member h4{ color: #1E82E6; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: 0 auto 30px; border-bottom: 3px solid #1E82E6; font-size: 18px; } @media (min-width: 768px){.SPL-page .SPL-content .CS-section .CS-member h4{ margin: 0 auto 60px; border-bottom: 4px solid #1E82E6; font-size: 28px; }} .SPL-page .SPL-content .CS-section .CS-member img{ width: 90%; margin-bottom: 20px; } @media (min-width: 768px){.SPL-page .SPL-content .CS-section .CS-member img{ width: 80%; margin-bottom: 40px; }} @media (min-width: 992px){.SPL-page .SPL-content .CS-section .CS-member img{ width: 90%; margin-bottom: 0px; }} .page .post-list{ margin: 0; } .concept-page section h2{ color: #1e3c8c; font-size: 20px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.concept-page section h2{ font-size: 28px; letter-spacing: 2px; margin-bottom: 48px; }} @media (min-width: 992px){.concept-page section h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 60px; }} @media (min-width: 1200px){.concept-page section h2{ font-size: 36px; letter-spacing: 3px; margin-bottom: 60px; }} .concept-page section h2::after{ content: ""; display: block; margin: 16px auto 0; width: 40px; height: 4px; border-radius: 3px; background-color: #1e3c8c; opacity: 0.2; } @media (min-width: 768px){.concept-page section h2::after{ width: 60px; margin: 20px auto 0; height: 6px; }} @media (min-width: 992px){.concept-page section h2::after{ width: 80px; margin: 24px auto 0; height: 6px; }} .concept-page section h3{ letter-spacing: 1px; } .concept-page section p{ color: #4b5363; font-size: 15px; line-height: 2; margin-bottom: 2em; } @media (min-width: 768px){.concept-page section p{ font-size: 16px; }} @media (min-width: 992px){.concept-page section p{ font-size: 18px; }} .concept-page section p:last-child{ margin-bottom: 0; } .concept-page .concept-section{ padding-top: 40px; padding-bottom: 40px; background-color: #ffffff; } @media screen and (min-width: 768px){.concept-page .concept-section{ padding-top: calc(3.90625vw + 10px); }} @media screen and (min-width: 1280px){.concept-page .concept-section{ padding-top: 60px; }} @media screen and (min-width: 768px){.concept-page .concept-section{ padding-bottom: calc(3.90625vw + 10px); }} @media screen and (min-width: 1280px){.concept-page .concept-section{ padding-bottom: 60px; }} .concept-page .concept-section .tagline{ margin: 0 auto; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; color: #1e3c8c; text-align: center; } .concept-page .concept-section .tagline .sub{ border-bottom: 1px solid #1e3c8c; padding-bottom: 8px; margin-bottom: 16px; font-weight: 700; font-size: 16px; } @media (min-width: 768px){.concept-page .concept-section .tagline .sub{ font-size: 20px; }} @media (min-width: 768px){.concept-page .concept-section .tagline .sub{ font-size: 24px; }} .concept-page .concept-section .tagline .main{ font-weight: 700; font-size: 32px; line-height: 1.4; } @media (min-width: 768px){.concept-page .concept-section .tagline .main{ font-size: 40px; }} @media (min-width: 992px){.concept-page .concept-section .tagline .main{ font-size: 48px; }} .concept-page .why-section{ padding-top: 40px; padding-bottom: 40px; background-color: #f4f6fA; } @media screen and (min-width: 768px){.concept-page .why-section{ padding-top: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.concept-page .why-section{ padding-top: 100px; }} @media screen and (min-width: 768px){.concept-page .why-section{ padding-bottom: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.concept-page .why-section{ padding-bottom: 100px; }} .concept-page .why-section h2{ color: #1e283c; } .concept-page .why-section h2::after{ background-color: #1e283c; } .concept-page .why-section .reason{ background-color: #ffffff; border-radius: 8px; padding: 24px; margin-bottom: 16px; } @media (min-width: 768px){.concept-page .why-section .reason{ padding: 32px; margin-bottom: 24px; }} .concept-page .why-section .reason h3{ color: #1e283c; font-weight: 700; font-size: 18px; line-height: 1.4; margin-bottom: 16px; text-align: center; } @media (min-width: 768px){.concept-page .why-section .reason h3{ font-size: 24px; margin-bottom: 24px; }} .concept-page .why-section .reason p{ color: #1e283c; font-size: 15px; line-height: 1.8; text-align: center; } @media (min-width: 768px){.concept-page .why-section .reason p{ font-size: 16px; }} .concept-page .why-section .reason p span{ font-weight: 700; color: #1E82E6; } @media (min-width: 768px){.concept-page .why-section .detail{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }} .concept-page .why-section .detail .pic{ text-align: center; margin-bottom: 16px; } @media (min-width: 768px){.concept-page .why-section .detail .pic{ margin-bottom: 0; }} .concept-page .why-section .detail .pic img{ width: 60%; } @media (min-width: 768px){.concept-page .why-section .detail .pic img{ width: 80%; }} .concept-page .why-section .detail .text li{ color: #1e283c; font-size: 15px; line-height: 1.5; margin-bottom: 12px; } @media (min-width: 768px){.concept-page .why-section .detail .text li{ font-size: 16px; }} @media (min-width: 992px){.concept-page .why-section .detail .text li{ margin-bottom: 16px; }} .concept-page .why-section .detail .text li:last-child{ margin-bottom: 0; } .concept-page .why-section .detail .text li span{ font-weight: 700; color: #1E82E6; } .concept-page .why-section .arrow{ text-align: center; padding-bottom: 0px; } .concept-page .why-section .arrow img{ margin-top: 0px; margin-bottom: 8px; width: 40px; } @media (min-width: 768px){.concept-page .why-section .arrow img{ width: 60px; margin-bottom: 16px; }} @media (min-width: 992px){.concept-page .why-section .arrow img{ width: 90px; }} .concept-page .why-section .message{ color: #1E82E6; font-weight: 700; text-align: center; font-size: 20px; line-height: 1.5; } @media (min-width: 768px){.concept-page .why-section .message{ font-size: 28px; }} .concept-page .why-section .message span{ color: #1e283c; font-size: 16px; } @media (min-width: 768px){.concept-page .why-section .message span{ font-size: 20px; }} .concept-page .flow-section{ padding-top: 40px; padding-bottom: 40px; background-color: #ffffff; } @media screen and (min-width: 768px){.concept-page .flow-section{ padding-top: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.concept-page .flow-section{ padding-top: 100px; }} @media screen and (min-width: 768px){.concept-page .flow-section{ padding-bottom: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.concept-page .flow-section{ padding-bottom: 100px; }} .concept-page .flow-section h2{ color: #1e283c; } .concept-page .flow-section ul{ padding: 0 16px; } @media (min-width: 768px){.concept-page .flow-section ul{ padding: 0 24px; }} .concept-page .flow-section li{ color: #1e283c; font-size: 15px; line-height: 1.8; margin-bottom: 8px; } @media (min-width: 768px){.concept-page .flow-section li{ font-size: 18px; margin-bottom: 10px; }} @media (min-width: 992px){.concept-page .flow-section li{ font-size: 20px; margin-bottom: 12px; }} .concept-page .flow-section .pic{ text-align: center; } .concept-page .flow-section .pic img{ width: 100%; margin-bottom: 32px; } @media (min-width: 768px){.concept-page .flow-section .pic img{ width: 100%; margin-bottom: 32px; }} .concept-page .product-section{ padding-top: 40px; padding-bottom: 40px; background-color: #f4f6fA; } @media screen and (min-width: 768px){.concept-page .product-section{ padding-top: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.concept-page .product-section{ padding-top: 100px; }} @media screen and (min-width: 768px){.concept-page .product-section{ padding-bottom: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.concept-page .product-section{ padding-bottom: 100px; }} .concept-page .product-section h2{ color: #1e283c; } .concept-page .product-section h2::after{ background-color: #1e283c; } .concept-page .product-section a{ display: block; background-color: #fff; -webkit-box-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.2); box-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.2); border-radius: 8px; margin-bottom: 16px; } @media (min-width: 768px){.concept-page .product-section a{ margin-bottom: 24px; }} @media (min-width: 1200px){.concept-page .product-section a{ margin-bottom: 24px; }} .concept-page .product-section a:hover{ -webkit-box-shadow: 0 10px 20px 0 rgba(30, 60, 140, 0.25); box-shadow: 0 10px 20px 0 rgba(30, 60, 140, 0.25); } .concept-page .product-section a img{ width: 100%; } .concept-page .product-section a .content{ padding: 24px; } @media (min-width: 768px){.concept-page .product-section a .content{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }} @media (min-width: 1200px){.concept-page .product-section a .content{ padding: 24px 32px; }} .concept-page .product-section a .content .title{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 16px; } @media (min-width: 768px){.concept-page .product-section a .content .title{ display: block; padding-right: 32px; margin-bottom: 0; }} @media (min-width: 992px){.concept-page .product-section a .content .title{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }} .concept-page .product-section a .content .title .phase{ background-color: #1e283c; text-align: center; color: #ffffff; border-radius: 4px; font-weight: 700; font-size: 14px; padding: 4px; margin-right: 16px; margin-bottom: 0; width: 80px; } @media (min-width: 768px){.concept-page .product-section a .content .title .phase{ font-size: 16px; width: 84px; margin-bottom: 12px; }} @media (min-width: 992px){.concept-page .product-section a .content .title .phase{ font-size: 18px; width: 96px; margin-bottom: 0; }} .concept-page .product-section a .content .title .name{ color: #1e283c; font-weight: 700; font-size: 24px; } @media (min-width: 768px){.concept-page .product-section a .content .title .name{ width: 100px; font-size: 24px; }} @media (min-width: 992px){.concept-page .product-section a .content .title .name{ width: 120px; font-size: 28px; }} @media (min-width: 1200px){.concept-page .product-section a .content .title .name{ width: 136px; font-size: 32px; }} .concept-page .product-section a .content .text{ -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin-bottom: 24px; line-height: 1.8; font-size: 14px; margin-bottom: 16px; text-align: center; } @media (min-width: 768px){.concept-page .product-section a .content .text{ font-size: 15px; padding-right: 24px; margin-bottom: 0; text-align: left; }} @media (min-width: 1200px){.concept-page .product-section a .content .text{ font-size: 16px; padding-right: 32px; }} .concept-page .product-section a .content .text span{ font-weight: 700; } @media (min-width: 768px){.concept-page .product-section a .content .text span{ font-size: 16px; }} @media (min-width: 1200px){.concept-page .product-section a .content .text span{ font-size: 18px; }} .concept-page .product-section a .content .logo{ text-align: center; } @media (min-width: 768px){.concept-page .product-section a .content .logo{ width: 200px; }} @media (min-width: 992px){.concept-page .product-section a .content .logo{ width: 240px; }} .concept-page .product-section a .content .logo img{ width: 70%; } @media (min-width: 768px){.concept-page .product-section a .content .logo img{ width: 100%; }} .history-page section h2{ color: #1e3c8c; font-size: 20px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.history-page section h2{ font-size: 28px; letter-spacing: 2px; margin-bottom: 48px; }} @media (min-width: 992px){.history-page section h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 60px; }} @media (min-width: 1200px){.history-page section h2{ font-size: 36px; letter-spacing: 3px; margin-bottom: 60px; }} .history-page section h2::after{ content: ""; display: block; margin: 16px auto 0; width: 40px; height: 4px; border-radius: 3px; background-color: #1e3c8c; opacity: 0.2; } @media (min-width: 768px){.history-page section h2::after{ width: 60px; margin: 20px auto 0; height: 6px; }} @media (min-width: 992px){.history-page section h2::after{ width: 80px; margin: 24px auto 0; height: 6px; }} .history-page section h3{ letter-spacing: 1px; } .history-page section p{ color: #4b5363; font-size: 15px; line-height: 2; margin-bottom: 2em; } @media (min-width: 768px){.history-page section p{ font-size: 16px; }} @media (min-width: 992px){.history-page section p{ font-size: 18px; }} .history-page section p:last-child{ margin-bottom: 0; } .history-page .summry-section{ padding-top: 30px; padding-bottom: 30px; background-color: #f4f6fA; } @media screen and (min-width: 768px){.history-page .summry-section{ padding-top: calc(5.85938vw + -15px); }} @media screen and (min-width: 1280px){.history-page .summry-section{ padding-top: 60px; }} @media screen and (min-width: 768px){.history-page .summry-section{ padding-bottom: calc(5.85938vw + -15px); }} @media screen and (min-width: 1280px){.history-page .summry-section{ padding-bottom: 60px; }} .history-page .summry-section .row .content-graphic{ text-align: center; } .history-page .summry-section .row .content-graphic img{ margin-bottom: 20px; width: 60%; } @media (min-width: 768px){.history-page .summry-section .row .content-graphic img{ width: 100%; }} .history-page .summry-section .row .content-graphic p{ text-align: center; font-size: 12px; line-height: 1.5; } @media (min-width: 992px){.history-page .summry-section .row .content-graphic p{ font-size: 16px; }} .history-page .summry-section .row .content-graphic p span{ font-weight: 700; font-size: 16px; } @media (min-width: 992px){.history-page .summry-section .row .content-graphic p span{ font-size: 20px; }} .history-page .summry-section .row .content-text{ padding-top: 20px; } .history-page .summry-section .row .content-text h3{ color: #1e283c; font-size: 18px; line-height: 1.5; margin: 0 0 20px; } @media (min-width: 768px){.history-page .summry-section .row .content-text h3{ font-size: 20px; margin: 0 0 30px; }} @media (min-width: 992px){.history-page .summry-section .row .content-text h3{ font-size: 20px; }} @media (min-width: 1200px){.history-page .summry-section .row .content-text h3{ font-size: 24px; }} .history-page .summry-section .row .content-text p{ color: #1e283c; font-size: 15px; line-height: 1.5; margin: 0 0 10px; } @media screen and (min-width: 768px){.history-page .summry-section .row .content-text p{ font-size: 16px; }} @media screen and (min-width: 992px){.history-page .summry-section .row .content-text p{ font-size: 16px; }} @media screen and (min-width: 1200px){.history-page .summry-section .row .content-text p{ font-size: 18px; }} .history-page .summry-section .row .content-text img{ margin: 0 0 10px; } .history-page .summry-section a.CTA-btn{ display: block; margin: 30px auto 0; color: #1E82E6; text-align: center; font-weight: 700; background-color: transparent; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #1E82E6), color-stop(50%, transparent)); background-image: linear-gradient(to right, #1E82E6 50%, transparent 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #1E82E6; font-size: 16px; width: 160px; padding: 16px; border-radius: 60px; } .history-page .summry-section a.CTA-btn:hover{ background-color: #1E82E6; background-position: left center; } .history-page .summry-section a.CTA-btn:hover{ color: #ffffff; } @media (min-width: 768px){.history-page .summry-section a.CTA-btn{ margin: 30px 0 0 auto; font-size: 18px; width: 180px; padding: 18px; }} @media (min-width: 992px){.history-page .summry-section a.CTA-btn{ font-size: 18px; width: 180px; padding: 18px; }} @media (min-width: 1200px){.history-page .summry-section a.CTA-btn{ font-size: 20px; width: 200px; padding: 20px; }} .history-page .history-section{ padding-top: 30px; padding-bottom: 30px; background-color: #ffffff; } @media screen and (min-width: 768px){.history-page .history-section{ padding-top: calc(13.67188vw + -75px); }} @media screen and (min-width: 1280px){.history-page .history-section{ padding-top: 100px; }} @media screen and (min-width: 768px){.history-page .history-section{ padding-bottom: calc(13.67188vw + -75px); }} @media screen and (min-width: 1280px){.history-page .history-section{ padding-bottom: 100px; }} .history-page .history-section .row .content-graphic{ text-align: center; } .history-page .history-section .row .content-graphic img{ margin-bottom: 40px; } @media (min-width: 768px){.history-page .history-section .row .content-graphic img{ margin-bottom: 60px; }} .history-page .history-section .row .content-text{ margin-bottom: 32px; } @media (min-width: 768px){.history-page .history-section .row .content-text{ margin-bottom: 60px; }} .history-page .history-section .row .content-text h3{ color: #1e283c; font-size: 20px; line-height: 1.5; margin: 0 0 8px; } @media (min-width: 768px){.history-page .history-section .row .content-text h3{ font-size: 24px; }} @media (min-width: 992px){.history-page .history-section .row .content-text h3{ font-size: 28px; margin: 0 0 16px; }} @media (min-width: 1200px){.history-page .history-section .row .content-text h3{ font-size: 32px; }} .history-page .history-section .row .content-text h3 div{ width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; background-color: #1e283c; border-radius: 4px; color: #ffffff; font-size: 20px; padding: 4px 16px; margin: 0 auto 8px; } @media (min-width: 992px){.history-page .history-section .row .content-text h3 div{ font-size: 24px; }} .history-page .history-section .row .content-text p{ color: #1e283c; font-size: 14px; margin-bottom: 10px; } @media screen and (min-width: 768px){.history-page .history-section .row .content-text p{ font-size: 16px; }} @media screen and (min-width: 992px){.history-page .history-section .row .content-text p{ font-size: 16px; margin-bottom: 0; }} @media screen and (min-width: 1200px){.history-page .history-section .row .content-text p{ font-size: 18px; }} .history-page .history-section .row .content-text p b{ font-weight: 700; font-size: 18px; } @media screen and (min-width: 992px){.history-page .history-section .row .content-text p b{ font-size: 20px; }} @media screen and (min-width: 1200px){.history-page .history-section .row .content-text p b{ font-size: 24px; }} .history-page .history-section .method{ padding-top: 30px; padding-bottom: 30px; background-color: #f4f6fA; margin-bottom: 60px; } @media screen and (min-width: 768px){.history-page .history-section .method{ padding-top: calc(5.85938vw + -15px); }} @media screen and (min-width: 1280px){.history-page .history-section .method{ padding-top: 60px; }} @media screen and (min-width: 768px){.history-page .history-section .method{ padding-bottom: calc(5.85938vw + -15px); }} @media screen and (min-width: 1280px){.history-page .history-section .method{ padding-bottom: 60px; }} .history-page .history-section .method .content-text{ margin-bottom: 30px; } @media (min-width: 992px){.history-page .history-section .method .content-text{ margin-bottom: 0; }} .history-page .history-section .method .content-text h3{ color: #1E82E6; font-size: 20px; } @media (min-width: 768px){.history-page .history-section .method .content-text h3{ font-size: 24px; }} @media (min-width: 992px){.history-page .history-section .method .content-text h3{ font-size: 26px; }} @media (min-width: 1200px){.history-page .history-section .method .content-text h3{ font-size: 24px; }} .history-page .history-section .method .content-graphic img{ margin-bottom: 0; } @media (min-width: 768px){.history-page .history-section .method .content-graphic img{ margin-bottom: 0; }} .mission-page section h2{ color: #1e3c8c; font-size: 20px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.mission-page section h2{ font-size: 28px; letter-spacing: 2px; margin-bottom: 48px; }} @media (min-width: 992px){.mission-page section h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 60px; }} @media (min-width: 1200px){.mission-page section h2{ font-size: 36px; letter-spacing: 3px; margin-bottom: 60px; }} .mission-page section h2::after{ content: ""; display: block; margin: 16px auto 0; width: 40px; height: 4px; border-radius: 3px; background-color: #1e3c8c; opacity: 0.2; } @media (min-width: 768px){.mission-page section h2::after{ width: 60px; margin: 20px auto 0; height: 6px; }} @media (min-width: 992px){.mission-page section h2::after{ width: 80px; margin: 24px auto 0; height: 6px; }} .mission-page section h3{ letter-spacing: 1px; } .mission-page section p{ color: #4b5363; font-size: 15px; line-height: 2; margin-bottom: 2em; } @media (min-width: 768px){.mission-page section p{ font-size: 16px; }} @media (min-width: 992px){.mission-page section p{ font-size: 18px; }} .mission-page section p:last-child{ margin-bottom: 0; } .mission-page .mission{ padding-top: 0px; padding-bottom: 40px; background-image: url("/assets/images/mission-bg.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover; } @media screen and (min-width: 768px){.mission-page .mission{ padding-top: calc(0vw + 0px); }} @media screen and (min-width: 1280px){.mission-page .mission{ padding-top: 0px; }} @media screen and (min-width: 768px){.mission-page .mission{ padding-bottom: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.mission-page .mission{ padding-bottom: 100px; }} .mission-page .mission .concept-section{ padding-top: 60px; padding-bottom: 40px; } @media screen and (min-width: 768px){.mission-page .mission .concept-section{ padding-top: calc(7.8125vw + 0px); }} @media screen and (min-width: 1280px){.mission-page .mission .concept-section{ padding-top: 100px; }} @media screen and (min-width: 768px){.mission-page .mission .concept-section{ padding-bottom: calc(3.90625vw + 10px); }} @media screen and (min-width: 1280px){.mission-page .mission .concept-section{ padding-bottom: 60px; }} .mission-page .mission .concept-section .tagline{ margin: 0 auto; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; color: #ffffff; text-align: center; text-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.2); } .mission-page .mission .concept-section .tagline .sub{ border-bottom: 1px solid #ffffff; padding-bottom: 8px; margin-bottom: 16px; font-weight: 700; font-size: 16px; } @media (min-width: 768px){.mission-page .mission .concept-section .tagline .sub{ font-size: 20px; }} @media (min-width: 768px){.mission-page .mission .concept-section .tagline .sub{ font-size: 24px; }} .mission-page .mission .concept-section .tagline .main{ font-weight: 700; font-size: 28px; line-height: 1.4; letter-spacing: 4px; } @media (min-width: 768px){.mission-page .mission .concept-section .tagline .main{ font-size: 40px; }} @media (min-width: 992px){.mission-page .mission .concept-section .tagline .main{ font-size: 48px; }} .mission-page .mission .mission-section p{ color: #ffffff; text-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.2); font-weight: 500; line-height: 2; font-size: 16px; } @media (min-width: 768px){.mission-page .mission .mission-section p{ text-align: center; font-size: 18px; }} @media (min-width: 992px){.mission-page .mission .mission-section p{ font-size: 20px; }} .mission-page .vision-section{ padding-top: 0px; padding-bottom: 40px; background-color: #ffffff; } @media screen and (min-width: 768px){.mission-page .vision-section{ padding-top: calc(0vw + 0px); }} @media screen and (min-width: 1280px){.mission-page .vision-section{ padding-top: 0px; }} @media screen and (min-width: 768px){.mission-page .vision-section{ padding-bottom: calc(11.71875vw + -50px); }} @media screen and (min-width: 1280px){.mission-page .vision-section{ padding-bottom: 100px; }} .mission-page .vision-section .concept-section{ padding-top: 60px; padding-bottom: 40px; } @media screen and (min-width: 768px){.mission-page .vision-section .concept-section{ padding-top: calc(7.8125vw + 0px); }} @media screen and (min-width: 1280px){.mission-page .vision-section .concept-section{ padding-top: 100px; }} @media screen and (min-width: 768px){.mission-page .vision-section .concept-section{ padding-bottom: calc(3.90625vw + 10px); }} @media screen and (min-width: 1280px){.mission-page .vision-section .concept-section{ padding-bottom: 60px; }} .mission-page .vision-section .concept-section .tagline{ margin: 0 auto; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; color: #1e3c8c; text-align: center; text-shadow: 0 5px 10px 0 rgba(30, 60, 140, 0.2); } .mission-page .vision-section .concept-section .tagline .sub{ border-bottom: 1px solid #1e3c8c; padding-bottom: 8px; margin-bottom: 8px; font-weight: 700; font-size: 16px; } @media (min-width: 768px){.mission-page .vision-section .concept-section .tagline .sub{ font-size: 20px; }} @media (min-width: 768px){.mission-page .vision-section .concept-section .tagline .sub{ font-size: 24px; }} .mission-page .vision-section .concept-section .tagline .main{ font-weight: 700; font-size: 24px; line-height: 1.4; letter-spacing: 2px; } @media (min-width: 768px){.mission-page .vision-section .concept-section .tagline .main{ font-size: 40px; letter-spacing: 4px; }} @media (min-width: 992px){.mission-page .vision-section .concept-section .tagline .main{ font-size: 48px; }} .mission-page .vision-section .concept-section .tagline .main span{ font-size: 16px; letter-spacing: 2px; } @media (min-width: 768px){.mission-page .vision-section .concept-section .tagline .main span{ font-size: 28px; }} @media (min-width: 992px){.mission-page .vision-section .concept-section .tagline .main span{ font-size: 32px; }} .mission-page .vision-section .pic{ margin-bottom: 40px; } @media (min-width: 768px){.mission-page .vision-section .pic{ margin-bottom: 60px; }} .mission-page .vision-section p{ color: #1e283c; font-weight: 700; font-size: 18px; line-height: 1.8; } @media (min-width: 768px){.mission-page .vision-section p{ text-align: center; font-size: 24px; }} .wp-download-page .white-paper{ background: #fff; } .wp-download-page .mw750{ max-width: 800px; margin: auto; padding: 20px 25px; } @media (min-width: 768px){.wp-download-page .mw750{ padding: 40px 25px; }} .wp-download-page .wp-note{ border-bottom: 1px solid #e8e9eb; margin: 0 0 40px; padding: 0 0 30px; } @media (min-width: 768px){.wp-download-page .wp-note{ -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; }} .wp-download-page .wp-note p{ color: #1e283c !important; margin-bottom: 0 !important; font-size: 18px; font-weight: 700; line-height: 1.5 !important; } @media (min-width: 768px){.wp-download-page .wp-note p{ font-size: 24px; }} .wp-download-page .wp-note p span{ font-weight: 400; font-size: 16px; } @media (min-width: 768px){.wp-download-page .wp-note p span{ font-size: 18px; }} .wp-download-page .wp-note .wp-title{ color: #1e283c !important; margin-bottom: 0 !important; font-size: 18px; font-weight: 700; line-height: 1.5 !important; } @media (min-width: 768px){.wp-download-page .wp-note .wp-title{ font-size: 24px; }} .wp-download-page .wp-note .wp-title .special{ font-weight: 400; font-size: 14px; line-height: 1.2 !important; color: #1e3c8c !important; border-bottom: 1px solid #1e3c8c; padding-bottom: 2px; margin-bottom: 12px !important; } .wp-download-page .wp-note .wp-title .main{ margin-bottom: 8px !important; } .wp-download-page .wp-note .wp-title .sub{ font-weight: 400; font-size: 16px; line-height: 1.2 !important; margin-bottom: 8px !important; } .wp-download-page .wp-note .wp-mock{ margin-bottom: 20px; text-align: center; } @media (min-width: 768px){.wp-download-page .wp-note .wp-mock{ -ms-flex-negative: 0; flex-shrink: 0; margin: 0; margin-right: 40px; width: 180px; }} .wp-download-page .wp-note .wp-mock img{ position: relative; width: 50%; } @media (min-width: 768px){.wp-download-page .wp-note .wp-mock img{ width: 100%; }} .wp-download-page .wp-summary{ border-bottom: 1px solid #e8e9eb; margin-bottom: 20px; } @media (min-width: 768px){.wp-download-page .wp-summary{ margin-bottom: 40px; }} .wp-download-page .wp-summary .title{ color: #1e3c8c; font-size: 18px; line-height: 1.5; margin-bottom: 20px; } @medica (min-width: 768px){ .wp-download-page .wp-summary .title { font-size: 24px; } } .wp-download-page .wp-summary P{ font-size: 16px; color: #1e283c; } .wp-download-page .wp-summary ul{ margin-bottom: 40px; } .wp-download-page .wp-summary ul li{ color: #1e283c; font-size: 16px; line-height: 1.5; margin-bottom: 8px; } @media (min-width: 768px){.wp-download-page .wp-summary ul li{ font-size: 18px; }} .wp-download-page .wp-description{ font-size: 14px !important; margin-bottom: 0 !important; color: #787e8a !important; } @media (min-width: 768px){.wp-download-page .wp-description{ font-size: 16px !important; padding: 0 20px; }} @media (max-width: 767px){.wp-download-page .wp-description{ line-height: 2 !important; }} .wp-download-page .wp-section{ background-color: #f4f6fA !important; padding: 30px 0; } @media (min-width: 768px){.wp-download-page .wp-section{ padding: 60px 0; }} .wp-download-page .wp-section h2{ font-size: 18px; line-height: 1.5; margin-bottom: 30px; } @media (min-width: 768px){.wp-download-page .wp-section h2{ font-size: 24px; }} .wp-download-page .wp-section .mock{ margin-bottom: 30px; } .wp-download-page .wp-section .mock img{ -webkit-box-shadow: 0 0px 20px 0 rgba(30, 60, 140, 0.1); box-shadow: 0 0px 20px 0 rgba(30, 60, 140, 0.1); width: 100%; } .wp-download-page .wp-section .wp-summary{ border: none; } .wp-download-page .wp-section .form-wrapper{ background-color: #ffffff; border-radius: 20px; padding: 30px 20px 20px; } @media (min-width: 768px){.wp-download-page .wp-section .form-wrapper{ padding: 40px 30px 30px; }} .wp-download-page .wp-section .form-wrapper .form-title{ text-align: center; color: #1e3c8c; font-weight: 700; font-size: 18px; margin-bottom: 20px; } @media (min-width: 768px){.wp-download-page .wp-section .form-wrapper .form-title{ font-size: 20px; margin-bottom: 30px; }} .wp-download-page .wp-section .form-wrapper .form-guidance{ text-align: center; color: #1e3c8c; line-height: 1.5; font-size: 14px; margin-bottom: 16px; } @media (min-width: 768px){.wp-download-page .wp-section .form-wrapper .form-guidance{ font-size: 16px; margin-bottom: 24px; }} .wp-download-page .wp-section .caution{ color: #787e8a; font-size: 12px; line-height: 1.5; margin-top: 16px; } .wp-download-page .wp-section .caution p{ margin: 0; } .wp-page .lead{ margin-top: 40px; margin-bottom: 40px; } @media screen and (min-width: 768px){.wp-page .lead{ margin-top: 60px; margin-bottom: 60px; text-align: center; }} .wp-page .wp-list{ margin-bottom: 60px; } @media screen and (min-width: 768px){.wp-page .wp-list{ margin-bottom: 100px; }} .wp-page .wp-list h2{ margin-top: 60px; margin-bottom: 20px; } @media screen and (min-width: 768px){.wp-page .wp-list h2{ margin-top: 60px; margin-bottom: 40px; }} .wp-page .wp-list .lead{ margin-bottom: 20px; } @media screen and (min-width: 768px){.wp-page .wp-list .lead{ text-align: center; margin-bottom: 30px; }} .wp-page .wp-list .lead.blog{ margin-bottom: 0px; } @media screen and (min-width: 768px){.wp-page .wp-list .lead.blog{ text-align: center; margin-bottom: 16px; }} .wp-page .wp-list .inner{ background-color: #fff; padding: 0; border-radius: 8px; margin-bottom: 20px; width: 100%; -webkit-box-shadow: 0 0 10px rgba(30, 60, 140, 0.05); box-shadow: 0 0 10px rgba(30, 60, 140, 0.05); } @media screen and (min-width: 768px){.wp-page .wp-list .inner{ margin-bottom: 30px; }} .wp-page .wp-list .inner .mock img{ border-radius: 8px 8px 0 0; width: 100%; } .wp-page .wp-list .inner .content{ padding: 10px 15px; } @media screen and (min-width: 768px){.wp-page .wp-list .inner .content{ padding: 14px 24px; }} .wp-page .wp-list .inner .content .title{ color: #1e283c; font-size: 14px; font-weight: 700; line-height: 1.5; margin-bottom: 10px; } @media screen and (min-width: 768px){.wp-page .wp-list .inner .content .title{ font-size: 15px; min-height: 94px; }} @media screen and (min-width: 992px){.wp-page .wp-list .inner .content .title{ font-size: 16px; min-height: 78px; }} .wp-page .wp-list .inner .content .title span{ font-weight: 400; font-size: 14px; } @media screen and (min-width: 992px){.wp-page .wp-list .inner .content .title span{ font-size: 16px; }} .wp-page .wp-list .inner .content .title .special{ font-weight: 400; color: #1e3c8c; font-size: 14px; line-height: 1.2; margin-bottom: 10px; padding-bottom: 2px; border-bottom: 1px solid #1e3c8c; } .wp-page .wp-list .inner .content .title .main{ color: #1e283c; font-size: 14px; font-weight: 700; line-height: 1.5; margin-bottom: 6px; } @media screen and (min-width: 768px){.wp-page .wp-list .inner .content .title .main{ font-size: 15px; }} @media screen and (min-width: 992px){.wp-page .wp-list .inner .content .title .main{ font-size: 16px; }} .wp-page .wp-list .inner .content .title .sub{ font-weight: 400; font-size: 12px; line-height: 1.2; margin-bottom: 8px; } @media screen and (min-width: 768px){.wp-page .wp-list .inner .content .title .sub{ font-size: 14px; }} .wp-page .wp-list .inner .content a{ background-color: #00bcd4; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #00bcd4)); background-image: linear-gradient(to right, transparent 50%, #00bcd4 50%); background-size: 200% 100%; background-position: right center; font-size: 14px; font-weight: 700; line-height: 16px; padding: 8px; width: 120px; text-align: center; white-space: nowrap; border-radius: 30px; color: #fff; border: 1px solid #00bcd4; display: block; margin: 0 auto; } .wp-page .wp-list .inner .content a:hover{ background-color: transparent; background-position: left center; } @media screen and (min-width: 992px){.wp-page .wp-list .inner .content a{ font-size: 14px; width: 140px; }} .wp-page .wp-list .inner .content a:hover{ color: #00bcd4; } .wp-page .wp-list .cta-title{ color: #fff; font-size: 18px; font-weight: 700; line-height: 1.5; letter-spacing: 1px; margin: 0 0 20px; text-align: center; } @media (min-width: 768px){.wp-page .wp-list .cta-title{ font-size: 20px; margin: 0 0 30px; }} @media (min-width: 992px){.wp-page .wp-list .cta-title{ font-size: 24px; letter-spacing: 2px; margin: 0 0 20px; }} @media (min-width: 1200px){.wp-page .wp-list .cta-title{ font-size: 24px; letter-spacing: 2px; }} .wp-page .wp-list .more{ text-align: right; } .wp-page .wp-list .more a{ color: #00bcd4; display: inline-block; font-size: 16px; line-height: 1; margin: 0; padding: 8px 0px; border: none; width: auto; } @media (min-width: 768px){.wp-page .wp-list .more a{ font-size: 18px; padding: 8px 0; }} .wp-page .wp-list .more a:hover{ color: #2d5dea; } .wp-page .wp-list .more a i{ font-size: 16px; margin-left: 6px; margin-top: -3px; vertical-align: middle; } @media screen and (min-width: 768px){.wp-page .wp-list .more a i{ font-size: 20px; margin-left: 8px; margin-top: -3px; }} @media screen and (min-width: 768px){.wp-page .fk-wp .inner .content .title{ min-height: 48px; }} .wp-page .wp-summary{ padding-top: 30px; margin-bottom: 20px; } @media (min-width: 768px){.wp-page .wp-summary{ margin-bottom: 20px; padding-top: 60px; }} .wp-page .wp-summary .title{ color: #1e3c8c; font-size: 18px; font-weight: 700; line-height: 1.5; margin-bottom: 20px; } @media (min-width: 768px){.wp-page .wp-summary .title{ font-size: 24px; }} .wp-page .wp-summary P{ font-size: 16px; color: #1e283c; margin-bottom: 20px; } .wp-page .wp-summary ul li{ color: #1e283c; font-size: 16px; line-height: 1.5; margin-bottom: 1em; } @media (min-width: 768px){.wp-page .wp-summary ul li{ font-size: 18px; }} @medica (min-width: 768px){ .wp-5m-download-page .wp-summary .title { font-size: 24px; } } .s-repo-download-page .post-little-banner{ padding: 60px 0 40px; } @media (max-width: 991px){.s-repo-download-page .post-little-banner{ padding: 40px 0 20px; }} .s-repo-download-page .white-paper{ background: #fff; } .s-repo-download-page .mw750{ max-width: 800px; margin: auto; padding: 20px 25px; } @media (min-width: 768px){.s-repo-download-page .mw750{ padding: 40px 25px; }} .s-repo-download-page .wp-note{ border-bottom: 1px solid #e8e9eb; margin: 0 0 40px; padding: 0 0 30px; } @media (min-width: 768px){.s-repo-download-page .wp-note{ -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; }} .s-repo-download-page .wp-note p{ color: #1e283c !important; margin-bottom: 0 !important; font-size: 18px; font-weight: 700; line-height: 1.5 !important; } @media (min-width: 768px){.s-repo-download-page .wp-note p{ font-size: 24px; }} .s-repo-download-page .wp-note p span{ font-weight: 400; font-size: 16px; } @media (min-width: 768px){.s-repo-download-page .wp-note p span{ font-size: 18px; }} .s-repo-download-page .wp-note .wp-title{ color: #1e283c !important; margin-bottom: 0 !important; font-size: 18px; font-weight: 700; line-height: 1.5 !important; } @media (min-width: 768px){.s-repo-download-page .wp-note .wp-title{ font-size: 24px; }} .s-repo-download-page .wp-note .wp-title .special{ font-weight: 400; font-size: 14px; line-height: 1.2 !important; color: #1e3c8c !important; border-bottom: 1px solid #1e3c8c; padding-bottom: 2px; margin-bottom: 12px !important; } .s-repo-download-page .wp-note .wp-title .main{ margin-bottom: 8px !important; } .s-repo-download-page .wp-note .wp-title .sub{ font-weight: 400; font-size: 16px; line-height: 1.2 !important; margin-bottom: 8px !important; } .s-repo-download-page .wp-note .wp-mock{ margin-bottom: 20px; text-align: center; } @media (min-width: 768px){.s-repo-download-page .wp-note .wp-mock{ -ms-flex-negative: 0; flex-shrink: 0; margin: 0; margin-right: 40px; width: 180px; }} .s-repo-download-page .wp-note .wp-mock img{ position: relative; width: 50%; } @media (min-width: 768px){.s-repo-download-page .wp-note .wp-mock img{ width: 100%; }} .s-repo-download-page .wp-summary{ border-bottom: 1px solid #e8e9eb; margin-bottom: 20px; } @media (min-width: 768px){.s-repo-download-page .wp-summary{ margin-bottom: 40px; }} .s-repo-download-page .wp-summary .title{ color: #1e3c8c; font-size: 18px; line-height: 1.5; margin-bottom: 20px; } @medica (min-width: 768px){ .s-repo-download-page .wp-summary .title { font-size: 24px; } } .s-repo-download-page .wp-summary P{ font-size: 16px; color: #1e283c; } .s-repo-download-page .wp-summary ul{ margin-bottom: 40px; } .s-repo-download-page .wp-summary ul li{ color: #1e283c; font-size: 16px; line-height: 1.5; margin-bottom: 1em; } @media (min-width: 768px){.s-repo-download-page .wp-summary ul li{ font-size: 18px; }} .s-repo-download-page .wp-description{ font-size: 14px !important; margin-bottom: 0 !important; color: #787e8a !important; } @media (min-width: 768px){.s-repo-download-page .wp-description{ font-size: 16px !important; padding: 0 20px; }} @media (max-width: 767px){.s-repo-download-page .wp-description{ line-height: 2 !important; }} .s-repo-download-page .wp-section{ background-color: #f4f6fA !important; padding: 30px 0; } @media (min-width: 768px){.s-repo-download-page .wp-section{ padding: 60px 0; }} .s-repo-download-page .wp-section h2{ font-size: 20px; line-height: 1.5; margin-bottom: 30px; } @media (min-width: 768px){.s-repo-download-page .wp-section h2{ font-size: 32px; }} .s-repo-download-page .wp-section .mock{ margin-bottom: 30px; } .s-repo-download-page .wp-section .mock img{ -webkit-box-shadow: 0 0px 20px 0 rgba(30, 60, 140, 0.1); box-shadow: 0 0px 20px 0 rgba(30, 60, 140, 0.1); } .s-repo-download-page .wp-section .wp-summary{ border: none; } .s-repo-download-page .wp-section .form-wrapper{ background-color: #ffffff; border-radius: 20px; padding: 30px 20px 20px; } @media (min-width: 768px){.s-repo-download-page .wp-section .form-wrapper{ padding: 40px 30px 30px; }} .s-repo-download-page .wp-section .form-wrapper .form-title{ text-align: center; color: #1e3c8c; font-weight: 700; font-size: 20px; margin-bottom: 20px; } @media (min-width: 768px){.s-repo-download-page .wp-section .form-wrapper .form-title{ font-size: 24px; margin-bottom: 30px; }} .s-repo-page .lead{ margin-top: 40px; margin-bottom: 40px; } @media screen and (min-width: 768px){.s-repo-page .lead{ margin-top: 60px; margin-bottom: 60px; }} @media screen and (min-width: 768px){.s-repo-page .lead p{ text-align: center; }} .s-repo-page .wp-list{ margin-bottom: 60px; } @media screen and (min-width: 768px){.s-repo-page .wp-list{ margin-bottom: 100px; }} .s-repo-page .wp-list h2{ margin-top: 60px; } @media screen and (min-width: 768px){.s-repo-page .wp-list h2{ margin-top: 80px; }} .s-repo-page .wp-list .row.row-eq-height{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .s-repo-page .wp-list .row > div{ display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; } @media screen and (min-width: 768px){.s-repo-page .wp-list .row > div{ -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 50%; }} .s-repo-page .wp-list .inner{ background-color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 10px 0; border-radius: 8px; margin-bottom: 20px; width: 100%; } @media screen and (min-width: 768px){.s-repo-page .wp-list .inner{ margin-bottom: 30px; }} .s-repo-page .wp-list .inner .mock{ -ms-flex-negative: 0; flex-shrink: 0; padding: 0 10px; } @media screen and (min-width: 768px){.s-repo-page .wp-list .inner .mock{ padding: 0 14px; }} @media screen and (min-width: 992px){.s-repo-page .wp-list .inner .mock{ padding: 0 18px; }} @media screen and (min-width: 1200px){.s-repo-page .wp-list .inner .mock{ padding: 0 20px; }} .s-repo-page .wp-list .inner .mock img{ width: 80px; } @media screen and (min-width: 768px){.s-repo-page .wp-list .inner .mock img{ width: 100px; }} @media screen and (min-width: 992px){.s-repo-page .wp-list .inner .mock img{ width: 150px; }} @media screen and (min-width: 1200px){.s-repo-page .wp-list .inner .mock img{ width: 180px; }} .s-repo-page .wp-list .inner .content{ padding: 10px 15px; border-left: 1px solid #e8e9eb; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } @media screen and (min-width: 768px){.s-repo-page .wp-list .inner .content{ padding: 14px 24px; }} .s-repo-page .wp-list .inner .content .title{ color: #1e283c; font-size: 16px; font-weight: 700; line-height: 1.5; margin-bottom: 10px; } @media screen and (min-width: 768px){.s-repo-page .wp-list .inner .content .title{ font-size: 16px; }} @media screen and (min-width: 992px){.s-repo-page .wp-list .inner .content .title{ font-size: 18px; min-height: 112px; }} .s-repo-page .wp-list .inner .content .title span{ font-weight: 400; font-size: 14px; } @media screen and (min-width: 992px){.s-repo-page .wp-list .inner .content .title span{ font-size: 16px; }} .s-repo-page .wp-list .inner .content .title .special{ font-weight: 400; color: #1e3c8c; font-size: 14px; line-height: 1.2; margin-bottom: 10px; padding-bottom: 2px; border-bottom: 1px solid #1e3c8c; } .s-repo-page .wp-list .inner .content .title .main{ color: #1e283c; font-size: 16px; font-weight: 700; line-height: 1.5; margin-bottom: 8px; } @media screen and (min-width: 768px){.s-repo-page .wp-list .inner .content .title .main{ font-size: 16px; }} @media screen and (min-width: 992px){.s-repo-page .wp-list .inner .content .title .main{ font-size: 18px; }} .s-repo-page .wp-list .inner .content .title .sub{ font-weight: 400; font-size: 14px; line-height: 1.2; margin-bottom: 8px; } .s-repo-page .wp-list .inner .content a{ background-color: #1e3c8c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #1e3c8c)); background-image: linear-gradient(to right, transparent 50%, #1e3c8c 50%); background-size: 200% 100%; background-position: right center; font-size: 14px; font-weight: 700; line-height: 1; padding: 8px; width: 140px; text-align: center; white-space: nowrap; border-radius: 30px; color: #fff; border: 1px solid #1e3c8c; display: block; margin-left: auto; margin-bottom: 6px; } .s-repo-page .wp-list .inner .content a:hover{ background-color: transparent; background-position: left center; } .s-repo-page .wp-list .inner .content a:last-child{ margin-bottom: 0; } @media screen and (min-width: 768px){.s-repo-page .wp-list .inner .content a{ font-size: 12px; width: 120px; }} @media screen and (min-width: 992px){.s-repo-page .wp-list .inner .content a{ font-size: 14px; width: 140px; }} .s-repo-page .wp-list .inner .content a:hover{ color: #1e3c8c; } .s-repo-page .wp-summary{ padding-top: 30px; margin-bottom: 20px; } @media (min-width: 768px){.s-repo-page .wp-summary{ margin-bottom: 20px; padding-top: 60px; }} .s-repo-page .wp-summary .title{ color: #1e3c8c; font-size: 18px; font-weight: 700; line-height: 1.5; margin-bottom: 20px; } @media (min-width: 768px){.s-repo-page .wp-summary .title{ font-size: 24px; }} .s-repo-page .wp-summary P{ font-size: 16px; color: #1e283c; margin-bottom: 20px; } .s-repo-page .wp-summary ul li{ color: #1e283c; font-size: 16px; line-height: 1.5; margin-bottom: 1em; } @media (min-width: 768px){.s-repo-page .wp-summary ul li{ font-size: 18px; }} .feature-page .page-banner{ padding: 160px 0 0; position: relative; text-align: center; } .feature-page .page-banner > *{ position: relative; z-index: 5; } .feature-page .page-banner::after{ background: #1e3c8c; bottom: -2560px; content: ""; display: block; left: 0; position: absolute; right: 0; top: 0; } .feature-page .page-title{ color: #fff; font-size: 80px; line-height: 1.5; font-weight: 900; } .feature-page .page-title span{ display: block; font-size: 30px; line-height: 1.5; font-weight: 900; } .feature-page .page-banner p{ color: #fff; font-size: 20px; line-height: 1.8; opacity: 0.8; width: 90%; margin: 60px auto 0; } .feature-page .page-banner + .page-content{ padding: 60px 0 0; position: relative; z-index: 2; } .feature-page .page-banner + .page-content > *{ position: relative; z-index: 5; } .feature-page .page-banner + .page-content::before{ background: #f4f6fA; bottom: -2560px; content: ""; display: block; left: 0; position: absolute; right: 0; top: -100px; -webkit-transform: skewY(-15deg); transform: skewY(-15deg); } .feature-page .page-banner video{ display: block; width: 75%; margin: 0 auto; border: #e8e9eb solid 1px; } @media screen and (max-width: 991px){.feature-page .page-banner{ padding: 120px 0 0; }.feature-page .page-banner + .page-content::before{ top: -30px; }} @media screen and (max-width: 767px){.feature-page .page-banner::after{ background: #1e3c8c; }.feature-page .page-title{ font-size: 48px; }.feature-page .page-title span{ font-size: 20px; }.feature-page .page-banner{ padding: 80px 0 0; }.feature-page .page-banner p{ font-size: 16px; line-height: 2; margin-top: 16px; padding: 0 25px; width: 100%; }.feature-page .page-banner + .page-content{ padding: 60px 0 0; }.feature-page .page-banner + .page-content::before{ top: -30px; }} .feature-page .front-page-content{ margin-top: 100px; } @media screen and (max-width: 767px){.feature-page .front-page-content{ margin-top: 60px; }} .feature-page.story-page .page-banner::after{ background: #1e3c8c; } .feature-page.story-page .page-banner .intro-story{ width: 1140px; height: 800px; margin: 80px auto 50px; position: relative; } .feature-page.story-page .page-banner .intro-story .story-segawa{ position: absolute; right: 0; top: 20%; width: 52%; } .feature-page.story-page .page-banner .intro-story .story-bubble{ position: absolute; left: -2%; top: 0; width: 59%; } .feature-page.story-page .page-banner .intro-story p.lead{ color: #fff; font-size: 18px; line-height: 2; text-align: left; position: absolute; left: 8%; top: 56%; margin: 0; padding: 0; opacity: 0.8; } @media screen and (max-width: 1199px){.feature-page.story-page .page-banner .intro-story{ width: 940px; height: 658px; }.feature-page.story-page .page-banner .intro-story p.lead{ left: 80px; bottom: 300px; }} @media screen and (max-width: 991px){.feature-page.story-page .page-banner .intro-story{ width: 750px; height: 525px; }.feature-page.story-page .page-banner .intro-story p.lead{ font-size: 16px; left: 30px; bottom: 280px; }} @media screen and (max-width: 767px){.feature-page.story-page .page-banner .intro-story{ width: 375px; height: 540px; margin: 0px auto 150px; }.feature-page.story-page .page-banner .intro-story .story-segawa{ right: -20px; top: 120px; width: 300px; }.feature-page.story-page .page-banner .intro-story .story-bubble{ position: absolute; left: 15px; top: 0px; width: 330px; }.feature-page.story-page .page-banner .intro-story p.lead{ font-size: 16px; line-height: 2; left: 6.6%; bottom: -120px; top: auto; }} .feature-page.story-page .page-banner + .page-content::before{ top: 0px !important; } .feature-page.story-page .page-banner + .page-content{ padding: 0 0; } .feature-page.story-page .page-banner + .page-content .row{ position: relative; } .feature-page.story-page .story-content .story-photo img{ width: 100%; -webkit-box-shadow: 0 10px 20px 0 rgba(30, 60, 140, 0.2); box-shadow: 0 10px 20px 0 rgba(30, 60, 140, 0.2); } .feature-page.story-page .story-content .story-title{ color: var(--fk-black); font-size: 48px; font-weight: bold; line-height: 1.25; } .feature-page.story-page .story-content .story-title::after{ content: ""; display: block; margin: 12px auto 0; width: 40px; height: 4px; border-radius: 3px; background-color: #fff; opacity: 0.2; } @media (min-width: 768px){.feature-page.story-page .story-content .story-title::after{ width: 60px; margin: 16px auto 0; height: 6px; }} .feature-page.story-page .story-content .story-text .story-sentence{ font-size: 16px; line-height: 2; } .feature-page.story-page .story-content .story-text .story-sentence img{ display: block; margin: 0 auto; } .feature-page.story-page .story-content .story-text .story-sentence span{ font-weight: bold; font-size: 18px; } .feature-page.story-page .story-content .story-text .story-sentence span.summary{ color: #1e3c8c; } .feature-page.story-page .story-content .story-text .story-sentence ul{ margin-top: 10px; } .feature-page.story-page .story-content .story-text .story-sentence ul li{ font-size: 16px; line-height: 1.5; margin-bottom: 10px; margin-bottom: 10px; } .feature-page.story-page .story-content .story-text .story-sentence ul li:last-child{ margin-bottom: 0px; } .feature-page.story-page .story-content img.square-L{ position: absolute; width: 48.6%; } .feature-page.story-page .story-content img.square-S{ position: absolute; width: 14.3%; } @media screen and (max-width: 1199px){.feature-page.story-page .story-content .story-title{ font-size: 40px; }.feature-page.story-page .story-content .story-text .story-sentence{ font-size: 16px; }} @media screen and (max-width: 991px){.feature-page.story-page .story-content .story-title{ font-size: 30px; }.feature-page.story-page .story-content .story-text .story-sentence{ font-size: 16px; line-height: 2; }.feature-page.story-page .story-content .story-text .story-sentence ul li{ font-size: 16px; }} @media screen and (max-width: 767px){.feature-page.story-page .page-banner + .page-content::before{ top: -80px; }.feature-page.story-page .story-content .story-title{ font-size: 28px; }} .feature-page.story-page .story-content .story01{ margin-bottom: 200px; position: relative; z-index: 19; } .feature-page.story-page .story-content .story01 .story-title{ text-align: right; margin-top: 59.4%; margin-bottom: 16.0%; } .feature-page.story-page .story-content .story01 .story-title::after{ margin: 16px 0 0 auto; } .feature-page.story-page .story-content .story01 img.square-L{ left: 25.4%; top: 20%; } .feature-page.story-page .story-content .story01 img.square-S{ left: 34.2%; top: 110%; } @media screen and (max-width: 767px){.feature-page.story-page .story-content .story01{ margin-bottom: 100px; }.feature-page.story-page .story-content .story01 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story01 img.square-L{ width: 80%; left: auto; right: 0; top: 20%; }.feature-page.story-page .story-content .story01 img.square-S{ width: 26.6%; left: 0; right: auto; top: 90%; }} .feature-page.story-page .story-content .story02{ margin-bottom: 150px; position: relative; z-index: 18; } .feature-page.story-page .story-content .story02 .story-title{ margin-top: 18.8%; margin-bottom: 12.0%; } .feature-page.story-page .story-content .story02 .story-text .story-sentence{ padding-left: 17.0%; } .feature-page.story-page .story-content .story02 img.square-L{ width: 31.5%; left: 42.7%; top: 22.2%; } .feature-page.story-page .story-content .story02 img.square-S{ left: 8.6%; top: 84.3%; } @media screen and (max-width: 767px){.feature-page.story-page .story-content .story02{ margin-bottom: 100px; }.feature-page.story-page .story-content .story02 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story02 .story-text .story-sentence{ padding-left: 0%; }.feature-page.story-page .story-content .story02 .story-photo{ text-align: right; }.feature-page.story-page .story-content .story02 .story-photo img{ width: 75%; }.feature-page.story-page .story-content .story02 img.square-L{ width: 80%; left: 0; right: auto; top: 30%; }.feature-page.story-page .story-content .story02 img.square-S{ width: 26.6%; left: auto; right: 0; top: 90%; }} .feature-page.story-page .story-content .story03{ margin-bottom: 200px; position: relative; z-index: 17; } .feature-page.story-page .story-content .story03 .story-title{ text-align: right; margin-top: 9.0%; margin-bottom: 26.1%; } .feature-page.story-page .story-content .story03 .story-title::after{ margin: 16px 0 0 auto; } .feature-page.story-page .story-content .story03 .story-text .story-sentence{ padding-right: 17.6%; } .feature-page.story-page .story-content .story03 img.square-L{ width: 40.0%; left: 42.8%; top: 28.6%; } .feature-page.story-page .story-content .story03 img.square-S{ left: 76.8%; top: 102.5%; } @media screen and (max-width: 767px){.feature-page.story-page .story-content .story03{ margin-bottom: 100px; }.feature-page.story-page .story-content .story03 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story03 .story-photo img{ width: 75%; }.feature-page.story-page .story-content .story03 img.square-L{ width: 80%; left: auto; right: 0; top: 40%; }.feature-page.story-page .story-content .story03 img.square-S{ width: 26.6%; left: 0; right: auto; top: 90%; }} .feature-page.story-page .story-content .story04{ margin-bottom: 150px; position: relative; z-index: 16; } .feature-page.story-page .story-content .story04 .story-title{ margin-top: 7.0%; margin-bottom: 7.0%; } .feature-page.story-page .story-content .story04 .story-text .story-sentence{ padding-left: 17%; padding-right: 17%; } .feature-page.story-page .story-content .story04 img.square-L{ left: 8.5%; top: 22%; } .feature-page.story-page .story-content .story04 img.square-S{ left: 77.2%; top: 84%; } @media screen and (max-width: 991px){.feature-page.story-page .story-content .story04 .story-text .story-sentence{ padding-right: 0; }} @media screen and (max-width: 767px){.feature-page.story-page .story-content .story04{ margin-bottom: 100px; }.feature-page.story-page .story-content .story04 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story04 .story-text .story-sentence{ padding-left: 0%; }.feature-page.story-page .story-content .story04 img.square-L{ width: 80%; left: 0; right: auto; top: 10%; }.feature-page.story-page .story-content .story04 img.square-S{ width: 26.6%; left: auto; right: 0; top: 95%; }} .feature-page.story-page .story-content .story05{ margin-bottom: 150px; position: relative; z-index: 15; } .feature-page.story-page .story-content .story05 .story-title{ text-align: right; margin-top: 14.0%; margin-bottom: 30.2%; } .feature-page.story-page .story-content .story05 .story-title::after{ margin: 16px 0 0 auto; } .feature-page.story-page .story-content .story05 .story-text .story-sentence{ padding-right: 21.2%; } .feature-page.story-page .story-content .story05 img.square-L{ width: 31.5%; left: 51.3%; top: 28.2%; } .feature-page.story-page .story-content .story05 img.square-S{ left: 42.8%; top: 80%; } @media screen and (max-width: 1199px){.feature-page.story-page .story-content .story05 .story-text .story-sentence{ padding-right: 0; }} @media screen and (max-width: 767px){.feature-page.story-page .story-content .story05{ margin-bottom: 100px; }.feature-page.story-page .story-content .story05 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story05 img.square-L{ width: 80%; left: auto; right: 0; top: 10%; }.feature-page.story-page .story-content .story05 img.square-S{ width: 26.6%; left: 0; right: auto; top: 90%; }} .feature-page.story-page .story-content .story06{ margin-bottom: 100px; position: relative; z-index: 14; } .feature-page.story-page .story-content .story06 .story-photo{ padding-top: 11.1%; } .feature-page.story-page .story-content .story06 .story-title{ margin-bottom: 15.8%; } .feature-page.story-page .story-content .story06 .story-text .story-sentence{ margin-left: 17.5%; } .feature-page.story-page .story-content .story06 .story-photo{ text-align: right; } .feature-page.story-page .story-content .story06 img.square-L{ left: 17.2%; top: 47.4%; } .feature-page.story-page .story-content .story06 img.square-S{ left: 60%; top: 76.1%; } @media screen and (max-width: 1199px){.feature-page.story-page .story-content .story06 .story-text .story-sentence{ margin-left: 0; }} @media screen and (max-width: 767px){.feature-page.story-page .story-content .story06{ margin-bottom: 100px; }.feature-page.story-page .story-content .story06 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story06 .story-text .story-sentence{ padding-left: 0%; }.feature-page.story-page .story-content .story06 .story-photo{ text-align: right; }.feature-page.story-page .story-content .story06 .story-photo img{ width: 75%; }.feature-page.story-page .story-content .story06 img.square-L{ width: 80%; left: 0; right: auto; top: 20%; }.feature-page.story-page .story-content .story06 img.square-S{ width: 26.6%; left: auto; right: 0; top: 95%; }} .feature-page.story-page .story-content .story07{ margin-bottom: 200px; position: relative; z-index: 13; } .feature-page.story-page .story-content .story07 .story-photo{ padding-top: 26%; } .feature-page.story-page .story-content .story07 .story-title{ text-align: right; margin-bottom: 15.2%; } .feature-page.story-page .story-content .story07 .story-title::after{ margin: 16px 0 0 auto; } .feature-page.story-page .story-content .story07 .story-text .story-sentence{ padding-right: 14.7%; } .feature-page.story-page .story-content .story07 .story-photo img{ width: 75%; } .feature-page.story-page .story-content .story07 img.square-L{ width: 57.2%; left: 25.7%; top: 13.9%; } .feature-page.story-page .story-content .story07 img.square-S{ left: 85.5%; top: 85.4%; } @media screen and (max-width: 991px){.feature-page.story-page .story-content .story07 .story-text .story-sentence{ padding-right: 0; }} @media screen and (max-width: 767px){.feature-page.story-page .story-content .story07{ margin-bottom: 100px; }.feature-page.story-page .story-content .story07 .story-photo{ padding-top: 0%; }.feature-page.story-page .story-content .story07 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story07 img.square-L{ width: 80%; left: auto; right: 0; top: 30%; }.feature-page.story-page .story-content .story07 img.square-S{ width: 26.6%; left: 0; right: auto; top: 95%; }} .feature-page.story-page .story-content .story08{ margin-bottom: 200px; position: relative; z-index: 12; } .feature-page.story-page .story-content .story08 .story-title{ margin-top: 7.0%; margin-bottom: 7.0%; } .feature-page.story-page .story-content .story08 .story-text .story-sentence{ padding-left: 8.7%; padding-right: 25.6%; } .feature-page.story-page .story-content .story08 img.square-L{ left: 51.2%; top: 18.8%; } .feature-page.story-page .story-content .story08 img.square-S{ left: 0%; top: 88.8%; } @media screen and (max-width: 991px){.feature-page.story-page .story-content .story08 .story-text .story-sentence{ padding-right: 0; }} @media screen and (max-width: 767px){.feature-page.story-page .story-content .story08{ margin-bottom: 100px; }.feature-page.story-page .story-content .story08 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story08 .story-text .story-sentence{ padding-left: 0%; }.feature-page.story-page .story-content .story08 img.square-L{ width: 80%; left: 0; right: auto; top: 10%; }.feature-page.story-page .story-content .story08 img.square-S{ width: 26.6%; left: auto; right: 0; top: 95%; }} .feature-page.story-page .story-content .story09{ margin-bottom: 200px; position: relative; z-index: 11; } .feature-page.story-page .story-content .story09 .story-title{ text-align: right; margin-top: 3.0%; margin-bottom: 18.6%; } .feature-page.story-page .story-content .story09 .story-title::after{ margin: 16px 0 0 auto; } .feature-page.story-page .story-content .story09 .story-text .story-sentence{ padding-right: 17.6%; } .feature-page.story-page .story-content .story09 .story-photo img{ width: 75%; } .feature-page.story-page .story-content .story09 img.square-L{ width: 40.2%; left: 42.7%; top: 33.8%; } .feature-page.story-page .story-content .story09 img.square-S{ left: 34.4%; top: 105%; } @media screen and (max-width: 1199px){.feature-page.story-page .story-content .story09 .story-text .story-sentence{ padding-right: 0; }} @media screen and (max-width: 767px){.feature-page.story-page .story-content .story09{ margin-bottom: 100px; }.feature-page.story-page .story-content .story09 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story09 img.square-L{ width: 80%; left: auto; right: 0; top: 30%; }.feature-page.story-page .story-content .story09 img.square-S{ width: 26.6%; left: 0; right: auto; top: 90%; }} .feature-page.story-page .story-content .story10{ margin-bottom: 200px; position: relative; z-index: 10; } .feature-page.story-page .story-content .story10 .story-title{ margin-top: 4.0%; margin-bottom: 7.0%; } .feature-page.story-page .story-content .story10 .story-text .story-sentence{ padding-left: 20.6%; } .feature-page.story-page .story-content .story10 img.square-L{ width: 57.2%; left: 8.5%; top: 31.1%; } .feature-page.story-page .story-content .story10 img.square-S{ left: 85.6%; top: 90%; } @media screen and (max-width: 767px){.feature-page.story-page .story-content .story10{ margin-bottom: 100px; }.feature-page.story-page .story-content .story10 .story-title{ margin-top: 32px; margin-bottom: 32px; }.feature-page.story-page .story-content .story10 .story-text .story-sentence{ padding-left: 0%; }.feature-page.story-page .story-content .story10 img.square-L{ width: 80%; left: 0; right: auto; top: 10%; }.feature-page.story-page .story-content .story10 img.square-S{ width: 26.6%; left: auto; right: 0; top: 95%; }} .year2030-page .page-banner{ background-image: url("/assets/images/year2030-segawa-s.jpg"); background-color: #1e3c8c; background-repeat: no-repeat; background-position: center top; background-size: cover; position: relative; text-align: center; } @media (min-width: 768px){.year2030-page .page-banner{ background-image: url("/assets/images/year2030-segawa.jpg"); background-position: left top; background-size: cover; }} .year2030-page .page-banner .inner{ background: -webkit-gradient(linear, left top, left bottom, from(rgba(30, 60, 140, 0)), to(#1e3c8c)); background: linear-gradient(to bottom, rgba(30, 60, 140, 0), #1e3c8c); padding: 160px 0 120px; } @media (min-width: 768px){.year2030-page .page-banner .inner{ padding: 240px 0 160px; }} .year2030-page .page-banner .page-title{ font-size: 32px; } @media (min-width: 768px){.year2030-page .page-banner .page-title{ font-size: 48px; }} @media (min-width: 992px){.year2030-page .page-banner .page-title{ font-size: 60px; }} .year2030-page .page-banner .page-title span{ font-weight: 500; font-size: 18px; } @media (min-width: 768px){.year2030-page .page-banner .page-title span{ font-size: 24px; }} .year2030-page .page-banner p{ color: #fff; font-size: 16px; line-height: 1.8; opacity: 0.8; width: 90%; margin: 40px auto 0; } @media (min-width: 768px){.year2030-page .page-banner p{ font-size: 18px; margin: 60px auto 0; }} .year2030-page .about{ margin-top: -80px; margin-bottom: 100px; padding: 0 30px; } .year2030-page .about .box{ border: solid 8px rgba(30, 60, 140, 0.2); background-color: #ffffff; padding-top: 24px; padding-bottom: 24px; } @media (min-width: 768px){.year2030-page .about .box{ border: solid 12px rgba(30, 60, 140, 0.2); padding-top: 48px; padding-bottom: 48px; }} .year2030-page .about .sub{ opacity: 0.1; font-size: 48px; font-weight: 700; text-align: center; color: #1e3c8c; } @media (min-width: 768px){.year2030-page .about .sub{ font-size: 90px; }} .year2030-page .about h2{ color: #1e283c; font-size: 24px; margin-top: -24px; margin-bottom: 24px; letter-spacing: 1px; } @media (min-width: 768px){.year2030-page .about h2{ font-size: 32px; letter-spacing: 2px; margin-top: -40px; margin-bottom: 32px; }} @media (min-width: 992px){.year2030-page .about h2{ font-size: 40px; }} @media (min-width: 1280px){.year2030-page .about h2{ font-size: 40px; }} .year2030-page .about h2::after{ display: none; } .year2030-page .about p{ padding: 0 24px; } @media (min-width: 768px){.year2030-page .about p{ padding: 0 60px; }} .year2030-page .year2030-block{ margin-bottom: 60px; } @media (min-width: 768px){.year2030-page .year2030-block{ margin-bottom: 100px; }} .year2030-page .year2030-block .title{ margin-bottom: 32px; } @media (min-width: 768px){.year2030-page .year2030-block .title{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; }} .year2030-page .year2030-block .title .head{ -ms-flex-negative: 0; flex-shrink: 0; width: 70px; color: #1e3c8c; margin: 0 auto 20px; } @media (min-width: 768px){.year2030-page .year2030-block .title .head{ border-right: 1px solid #1e3c8c; padding-right: 30px; margin: 0; width: 100px; }} .year2030-page .year2030-block .title .head .chapter{ font-size: 20px; font-weight: 400; text-align: center; margin-bottom: 12px; padding-bottom: 6px; border-bottom: 1px solid #1e3c8c; } @media (min-width: 768px){.year2030-page .year2030-block .title .head .chapter{ padding-bottom: 12px; padding-bottom: 0; border-bottom: none; }} .year2030-page .year2030-block .title .head .number{ font-size: 72px; font-weight: 100; text-align: center; } .year2030-page .year2030-block .title .main-title{ -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; color: #1e283c; font-weight: 700; font-size: 22px; letter-spacing: 1px; line-height: 1.5; text-align: center; } @media (min-width: 768px){.year2030-page .year2030-block .title .main-title{ padding-left: 30px; font-size: 40px; letter-spacing: 2px; text-align: left; }} .year2030-page .year2030-block .text-wrapper{ background-color: #fff; padding: 30px 0 60px; } @media (min-width: 768px){.year2030-page .year2030-block .text-wrapper{ padding: 40px 0 80px; }} .year2030-page .year2030-block .text-wrapper .text{ font-size: 16px; line-height: 2; } .year2030-page .year2030-block .text-wrapper figure{ display: block; margin: 40px 0; } @media (min-width: 768px){.year2030-page .year2030-block .text-wrapper figure{ margin: 40px -20px; }} @media (min-width: 992px){.year2030-page .year2030-block .text-wrapper figure{ margin: 60px -100px; }} @media (min-width: 1280px){.year2030-page .year2030-block .text-wrapper figure{ margin: 60px -160px; }} .year2030-page .year2030-block .text-wrapper .sub-title{ color: #1e3c8c; font-weight: 700; font-size: 20px; letter-spacing: 1px; } .year2030-page .year2030-block .text-wrapper .sub-title span{ font-size: 16px; } .year2030-page .year2030-block .text-wrapper ul{ margin-top: 30px; margin-bottom: 30px; } .year2030-page .year2030-block .text-wrapper ul li{ font-weight: 700; line-height: 1.5; margin-bottom: 20px; } .year2030-page .year2030-block .text-wrapper ul li:last-child{ margin-bottom: 0; } .year2030-page .year2030-block .text-wrapper ul li span{ font-weight: 400; font-size: 14px; } .archive-paper{ } .archive-paper input{ display: none; } .archive-paper h2{ color: #1e3c8c; font-size: 24px; font-weight: 700; line-height: 1.5; margin-bottom: 32px; text-align: center; letter-spacing: 1px; } @media (min-width: 768px){.archive-paper h2{ font-size: 32px; letter-spacing: 2px; margin-bottom: 48px; }} .archive-paper h2::after{ content: ""; display: block; margin: 12px auto 0; width: 40px; height: 4px; border-radius: 3px; background-color: #1e3c8c; opacity: 0.2; } @media (min-width: 768px){.archive-paper h2::after{ width: 60px; margin: 16px auto 0; height: 6px; }} .seminar-page .lead{ margin-top: 40px; margin-bottom: 40px; padding: 0 15px; } @media screen and (min-width: 768px){.seminar-page .lead{ margin-top: 60px; margin-bottom: 60px; text-align: center; }} .seminar-page .seminar-list{ margin-bottom: 60px; } @media screen and (min-width: 768px){.seminar-page .seminar-list{ margin-bottom: 100px; }} .seminar-page .seminar-list h2{ margin-top: 60px; margin-bottom: 20px; } @media screen and (min-width: 768px){.seminar-page .seminar-list h2{ margin-top: 60px; margin-bottom: 40px; }} .seminar-page .seminar-list .lead{ margin: 16px 0; } @media screen and (min-width: 768px){.seminar-page .seminar-list .lead{ text-align: center; margin: 30px 0; }} .seminar-page .seminar-list .post-list.seminar-new{ display: block; list-style: none; margin: 0; padding: 0; } .seminar-page .seminar-list .post-list.seminar-new > li{ display: block; margin: 0; padding: 15px; width: 100%; } .seminar-page .seminar-list .post-list.seminar-new .card{ background: #fff; -webkit-box-shadow: 0 3px 6px 0 rgba(30, 60, 140, 0.2); box-shadow: 0 3px 6px 0 rgba(30, 60, 140, 0.2); display: block; } .seminar-page .seminar-list .post-list.seminar-new .card > a{ display: block; } @media (min-width: 768px){.seminar-page .seminar-list .post-list.seminar-new .card > a{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }} .seminar-page .seminar-list .post-list.seminar-new .card > a:hover{ -webkit-box-shadow: 0 6px 12px 0 rgba(30, 60, 140, 0.2); box-shadow: 0 6px 12px 0 rgba(30, 60, 140, 0.2); } .seminar-page .seminar-list .post-list.seminar-new .card > a:hover .post-thumbnail{ -webkit-transform: translateY(0px); transform: translateY(0px); } .seminar-page .seminar-list .post-list.seminar-new .card .post-thumbnail{ margin-bottom: 0px; text-align: left; } @media (min-width: 768px){.seminar-page .seminar-list .post-list.seminar-new .card .post-thumbnail{ -ms-flex-preferred-size: 50%; flex-basis: 50%; }} @media (min-width: 992px){.seminar-page .seminar-list .post-list.seminar-new .card .post-thumbnail{ -ms-flex-preferred-size: 40%; flex-basis: 40%; }} @media (min-width: 1200px){.seminar-page .seminar-list .post-list.seminar-new .card .post-thumbnail{ -ms-flex-preferred-size: 40%; flex-basis: 40%; }} .seminar-page .seminar-list .post-list.seminar-new .card .post-thumbnail > img{ height: auto; width: 100%; } .seminar-page .seminar-list .post-list.seminar-new .card .card-body{ display: block; background: #fff; padding: 16px 16px; position: relative; } @media (min-width: 768px){.seminar-page .seminar-list .post-list.seminar-new .card .card-body{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-preferred-size: 50%; flex-basis: 50%; }} @media (min-width: 992px){.seminar-page .seminar-list .post-list.seminar-new .card .card-body{ -ms-flex-preferred-size: 60%; flex-basis: 60%; padding: 20px 20px; }} @media (min-width: 1200px){.seminar-page .seminar-list .post-list.seminar-new .card .card-body{ -ms-flex-preferred-size: 60%; flex-basis: 60%; }} .seminar-page .seminar-list .post-list.seminar-new .card .card-footer{ border-top: 1px solid #e8e9eb; padding: 12px 24px; } .seminar-page .seminar-list .post-list.seminar-new .card .post-meta{ margin-bottom: 0px; display: block; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: left; -ms-flex-align: left; align-items: left; } .seminar-page .seminar-list .post-list.seminar-new .card .post-title{ color: #1e283c; font-size: 16px; line-height: 1.5; margin-bottom: 16px; } @media (min-width: 768px){.seminar-page .seminar-list .post-list.seminar-new .card .post-title{ font-size: 16px; margin-bottom: 16px; }} @media (min-width: 992px){.seminar-page .seminar-list .post-list.seminar-new .card .post-title{ font-size: 18px; margin-bottom: 18px; }} @media (min-width: 1200px){.seminar-page .seminar-list .post-list.seminar-new .card .post-title{ font-size: 20px; margin-bottom: 20px; }} .seminar-page .seminar-list .post-list.seminar-new .card .post-date{ color: #4b5363; font-size: 12px; line-height: 16px; margin-top: 8px; } @media (min-width: 992px){.seminar-page .seminar-list .post-list.seminar-new .card .post-date{ font-size: 16px; line-height: 20px; margin-top: 12px; }} .seminar-page .seminar-list .post-list.seminar-new .card .post-summary p{ color: #4b5363; font-size: 12px; line-height: 18px; margin-top: 8px; } @media (min-width: 992px){.seminar-page .seminar-list .post-list.seminar-new .card .post-summary p{ font-size: 14px; line-height: 20px; margin-top: 8px; }} @media (min-width: 1200px){.seminar-page .seminar-list .post-list.seminar-new .card .post-summary p{ font-size: 16px; line-height: 24px; margin-top: 12px; }} .seminar-page .more{ text-align: right; } .seminar-page .more a{ color: #00bcd4; display: inline-block; font-size: 16px; line-height: 1; margin: 0; padding: 8px 0px; border: none; width: auto; } @media (min-width: 768px){.seminar-page .more a{ font-size: 18px; padding: 8px 0; }} .seminar-page .more a:hover{ color: #2d5dea; } .seminar-page .more a i{ font-size: 16px; margin-left: 6px; margin-top: -3px; vertical-align: middle; } @media screen and (min-width: 768px){.seminar-page .more a i{ font-size: 20px; margin-left: 8px; margin-top: -3px; }} .seminar{ background: #fff; } .seminar .seminar-post.container{ padding-top: 30px !important; } @media (max-width: 767px){.seminar .seminar-post.container{ padding-top: 0 !important; }} .seminar .seminar-post.container.no-padd{ padding-bottom: 0 !important; } @media (max-width: 767px){.seminar .seminar-post.container.no-padd{ padding-top: 0 !important; }} .seminar .Hubspot-form{ padding: 20px 0 !important; } @media (max-width: 767px){.seminar .Hubspot-form{ padding: 0 !important; }} .seminar .Hubspot-form .container{ padding-bottom: 0 !important; } .seminar .Hubspot-form p{ font-size: 12px; color: #a5a9b1; line-height: 1.5; padding-top: 30px; } .seminar .seminar-entry{ margin: 40px 0; } .seminar .seminar-entry .cta-link a{ background-color: #00BCD4; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #00BCD4)); background-image: linear-gradient(to right, transparent 50%, #00BCD4 50%); background-size: 200% 100%; background-position: right center; border: 2px solid #00BCD4; color: #fff; display: inline-block; font-size: 20px; font-weight: bold; line-height: 1; padding: 20px 30px; white-space: nowrap; text-align: center; border-radius: 40px; width: 100%; } @media (max-width: 767px){.seminar .seminar-entry .cta-link a{ font-size: 18px; }} .seminar .seminar-entry .cta-link a:hover{ color: #00BCD4; background-color: transparent; background-position: left center; } .seminar .seminar-entry.single-day .cta-link a{ display: block; width: 320px; margin: 0 auto; } @media (max-width: 767px){.seminar .seminar-entry.single-day .cta-link a{ width: 280px; }} .seminar .seminar-end{ text-align: center; } .seminar .seminar-end p{ background-color: #f4f6fA; color: #1e3c8c; display: inline-block; padding: 16px; font-size: 16px; font-weight: 700; line-height: 1.5; } @media (min-width: 768px){.seminar .seminar-end p{ font-size: 18px; padding: 16px 32px; }} .seminar p.seminar-lead{ font-size: 16px; text-align: center; padding: 0 15px; } @media (max-width: 767px){.seminar p.seminar-lead{ text-align: left; }} .seminar p.seminar-lead strong{ font-size: 20px; font-weight: 700; color: #1e283c; } @media (max-width: 767px){.seminar p.seminar-lead strong{ font-size: 16px; }} .seminar p.seminar-lead strong.navy{ color: #1e3c8c !important; } .seminar p.seminar-lead.align-left{ font-size: 16px; text-align: left; padding: 0 25px; margin-bottom: 0; } @media (max-width: 767px){.seminar p.seminar-lead.align-left{ padding: 0 15px; }} .seminar p.seminar-lead.align-left strong{ font-size: 20px; font-weight: 700; color: #1e283c; line-height: 1.6; } @media (max-width: 767px){.seminar p.seminar-lead.align-left strong{ font-size: 16px; }} .seminar .seminar-point{ color: #1e3c8c; background-color: #f4f6fA; border-radius: 8px; padding: 30px; margin: 0 25px 40px; } @media (max-width: 767px){.seminar .seminar-point{ margin: 0 0 40px; padding: 15px; }} .seminar .seminar-point p{ color: #1e3c8c; font-size: 20px; font-weight: 700; line-height: 1.5; text-align: left; margin-bottom: 24px; } @media (max-width: 767px){.seminar .seminar-point p{ font-size: 16px; margin-bottom: 16px; }} .seminar .seminar-point ul{ margin: 0 0 0 24px; } .seminar .seminar-point ul li{ color: #1e283c; font-weight: 700; font-size: 20px; line-height: 1.5; margin-bottom: 10px; } .seminar .seminar-point ul li:last-child{ margin-bottom: 0px; } .seminar .seminar-point ul li b{ color: #1e3c8c; } .seminar .seminar-point ul li span{ font-weight: 400; font-size: 14px; } @media (min-width: 768px){.seminar .seminar-point ul li span{ font-size: 16px; }} @media (max-width: 767px){.seminar .seminar-point ul li{ font-size: 16px; }} .seminar .seminar-task{ color: #fff; background-color: #a5a9b1; border-radius: 8px; padding: 30px; margin: 40px 30px; } @media (max-width: 767px){.seminar .seminar-task{ margin: 30px 0; padding: 15px; }} .seminar .seminar-task p{ color: #fff; font-size: 20px; font-weight: 400; line-height: 1.5; text-align: left; margin-bottom: 24px; } @media (max-width: 767px){.seminar .seminar-task p{ font-size: 16px; margin-bottom: 16px; }} .seminar .seminar-task ul{ margin: 0 0 0 24px; } .seminar .seminar-task ul li{ color: #fff; font-size: 20px; line-height: 1.5; margin-bottom: 10px; } .seminar .seminar-task ul li:last-child{ margin-bottom: 0px; } .seminar .seminar-task ul li b{ font-weight: 700; } @media (max-width: 767px){.seminar .seminar-task ul li{ font-size: 16px; }} .seminar .seminar-voice{ color: #1e3c8c; border: 2px solid #1e3c8c; border-radius: 8px; padding: 30px; margin: 40px 30px; } @media (max-width: 767px){.seminar .seminar-voice{ margin: 30px 0; padding: 15px; }} .seminar .seminar-voice ul{ margin: 0 0 0 24px; list-style: none; } .seminar .seminar-voice ul li{ color: #1e283c; font-size: 18px; line-height: 1.5; margin-bottom: 18px; } .seminar .seminar-voice ul li:last-child{ margin-bottom: 0px; } @media (max-width: 767px){.seminar .seminar-voice ul li{ font-size: 16px; margin-bottom: 16px; }} .seminar h3{ text-align: center; font-size: 32px !important; margin-top: 150px !important; margin-bottom: 60px !important; color: #1e3c8c !important; } @media (max-width: 767px){.seminar h3{ font-size: 28px !important; margin-top: 60px !important; margin-bottom: 40px !important; }} .seminar h3::after{ content: ""; display: block; margin: 18px auto 0; width: 60px; height: 6px; border-radius: 3px; background-color: #1e3c8c; opacity: 0.2; } @media (max-width: 991px){.seminar .profile{ margin-bottom: 30px; }} .seminar .profile .portrait{ margin-bottom: 32px; text-align: center; } @media (max-width: 991px){.seminar .profile .portrait{ text-align: center; }} .seminar .profile .portrait img{ max-width: 80%; } .seminar .profile .portrait.single img{ max-width: 100%; } .seminar .profile .position{ margin-bottom: 8px; font-size: 14px; line-height: 1.2; } .seminar .profile .name{ margin-bottom: 16px; font-size: 24px; font-weight: 700; color: #1e283c; } .seminar .profile .name span{ font-size: 18px; } .seminar .profile .history{ margin-bottom: 0; } .seminar .single-cast{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } @media (max-width: 991px){.seminar .single-cast{ display: block; }} .seminar .agenda ul{ background-color: #f4f6fA; border-radius: 8px; padding: 40px 40px 40px 60px; margin: 0; } @media (max-width: 767px){.seminar .agenda ul{ padding: 20px 10px 20px 40px; }} .seminar .agenda ul li{ font-size: 20px; font-weight: 700; color: #1e283c; margin-bottom: 16px; line-height: 1.5; } @media (max-width: 767px){.seminar .agenda ul li{ font-size: 18px; margin-bottom: 12px; }} .seminar .agenda ul li span{ font-weight: 400; } .seminar .agenda ul li strong{ color: #1e3c8c; } .seminar .agenda ul li ul{ padding: 16px 0 0; margin: 0; } .seminar .agenda ul li ul li{ font-size: 16px; font-weight: 400; margin-bottom: 12px; } @media (max-width: 767px){.seminar .agenda ul li ul li{ font-size: 14px; margin-bottom: 8px; }} .seminar .agenda ul li ul li:last-child{ margin-bottom: 0; } .seminar .agenda ul p.note{ margin-bottom: 0; margin-left: -24px; line-height: 1.5; padding-top: 8px; } @media (max-width: 767px){.seminar .agenda ul p.note{ font-size: 12px; }} .seminar .summary .title{ background-color: #f4f6fA; border-radius: 8px; padding: 40px 40px 32px; font-weight: 400; text-align: center; font-size: 18px; line-height: 1.2; margin-bottom: 24px; } @media (max-width: 767px){.seminar .summary .title{ padding: 20px 20px 12px; text-align: left; font-size: 16px; margin-bottom: 16px; }} .seminar .summary .title div{ margin-bottom: 8px; } .seminar .summary .title .main{ font-weight: 700; font-size: 24px; } @media (max-width: 767px){.seminar .summary .title .main{ font-size: 20px; }} .seminar .summary .title .main-L{ font-weight: 700; font-size: 36px; } @media (max-width: 767px){.seminar .summary .title .main-L{ font-size: 30px; }} .seminar .summary ul li{ color: #1e283c; font-size: 20px; margin-bottom: 16px; } @media (max-width: 767px){.seminar .summary ul li{ font-size: 18px; margin-bottom: 12px; }} .seminar .summary ul li strong{ font-size: 20px; font-weight: 700; } @media (max-width: 767px){.seminar .summary ul li strong{ font-size: 18px; }} .seminar .summary ul p.note{ margin-bottom: 0; color: #787e8a; line-height: 1.5; } @media (max-width: 767px){.seminar .summary ul p.note{ font-size: 12px; }} .seminar .summary p.addition{ margin-bottom: 0; font-size: 16px; } @media (max-width: 767px){.seminar .summary p.addition{ font-size: 14px; }} .seminar .privacy{ border-top: 1px solid #E7EAF3; padding-top: 40px; margin-bottom: 20px; margin-top: 100px; } @media (max-width: 767px){.seminar .privacy{ padding-top: 20px; margin-bottom: 20px; margin-top: 40px; }} .seminar .privacy p{ font-size: 14px; margin-bottom: 20px; color: #787e8a; } @media (max-width: 767px){.seminar .privacy p{ font-size: 12px; }} .seminar .voice ul li{ list-style: none; margin-bottom: 30px; } .seminar .voice ul li p{ font-size: 16px; margin-bottom: 12px; line-height: 1.5; } @media (max-width: 767px){.seminar .voice ul li p{ font-size: 15px; margin-bottom: 8px; }} .seminar .voice ul li blockquote{ background-color: #f4f6fA; color: #1e283c; font-size: 20px; font-weight: 700; line-height: 1.8; padding: 60px 80px 40px; position: relative; } @media (max-width: 767px){.seminar .voice ul li blockquote{ font-size: 16px; padding: 40px 20px 20px; }} .seminar .voice ul li blockquote::before{ content: "“"; position: absolute; top: -20px; left: 20px; color: #1e3c8c; opacity: 0.3; font-size: 80px; font-family: "Noto sans JP"; } @media (max-width: 767px){.seminar .voice ul li blockquote::before{ font-size: 60px; top: -20px; left: 10px; }} .seminar .voice ul p.note{ margin-bottom: 0; margin-left: -24px; line-height: 1.5; padding-top: 8px; } @media (max-width: 767px){.seminar .voice ul p.note{ font-size: 12px; }} .seminar .Hubspot-form{ padding: 60px 0; } @media (max-width: 767px){.seminar .Hubspot-form{ padding: 40px 0; }} .seminar .Hubspot-form .sub-btn{ text-align: center; padding-top: 10px; } .seminar .Hubspot-form .sub-btn a{ display: inline-block; color: #787e8a; font-size: 14px; font-weight: 400; background-repeat: no-repeat; background-position: left center; padding: 10px 0 10px 30px; margin: 0 16px; } .seminar .Hubspot-form .sub-btn a:hover{ opacity: 0.7; } .seminar .Hubspot-form .sub-btn a.event-info{ background-image: url("/assets/images/seminar-back-s.svg"); } .seminar .timetable .row{ padding-bottom: 60px; } .seminar .timetable .time{ background-color: #f4f6fA; border-radius: 8px; padding: 16px; font-weight: 400; text-align: center; font-size: 16px; line-height: 1.2; } @media (min-width: 992px){.seminar .timetable .time{ padding: 24px 16px; }} .seminar .timetable .time .session{ font-size: 24px; color: #1e3c8c; font-weight: 700; margin-bottom: 8px; } .seminar .timetable .time .btn-details{ margin-top: 12px; } @media (min-width: 992px){.seminar .timetable .time .btn-details{ margin-top: 24px; }} .seminar .timetable .time .btn-details a{ background-color: #1e3c8c; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #1e3c8c)); background-image: linear-gradient(to right, transparent 50%, #1e3c8c 50%); background-size: 200% 100%; background-position: right center; border: 1px solid #1e3c8c; color: #fff; display: inline-block; font-size: 16px; font-weight: 500; line-height: 1; padding: 6px; white-space: nowrap; text-align: center; border-radius: 40px; width: 33%; } @media (min-width: 992px){.seminar .timetable .time .btn-details a{ font-size: 16px; padding: 8px; width: 100%; }} .seminar .timetable .time .btn-details a:hover{ color: #1e3c8c; background-color: transparent; background-position: left center; } .seminar .timetable .contents{ padding-top: 16px; } @media (min-width: 992px){.seminar .timetable .contents{ padding-top: 0; }} .seminar .timetable .contents .main{ font-size: 24px; font-weight: 700; color: #1e283c; line-height: 1.2; margin-bottom: 8px; } @media (min-width: 992px){.seminar .timetable .contents .main{ font-size: 32px; margin-bottom: 4px; }} .seminar .timetable .contents .sub{ font-size: 16px; font-weight: 500; padding-bottom: 16px; margin-bottom: 16px; line-height: 1.5; color: #1e283c; border-bottom: 1px solid #d2d4d8; } @media (min-width: 992px){.seminar .timetable .contents .sub{ font-size: 18px; }} .seminar .timetable .contents .speakers{ font-size: 12px; line-height: 1.5; } .seminar .timetable .contents .speakers span{ font-weight: 500; font-size: 16px; } .seminar .timetable .contents .speakers .moderator{ font-size: 12px; color: #1e3c8c; margin: 8px 0 4px; } .seminar hr.hr-details{ border: none; padding-top: 30px; } @media (min-width: 992px){.seminar hr.hr-details{ padding-top: 60px; }} .seminar .details{ padding-top: 90px; margin-top: -90px; } @media (min-width: 992px){.seminar .details{ padding-top: 120px; margin-top: -120px; }} .seminar .details .time{ background-color: #1e3c8c; color: #fff; border-radius: 8px; padding: 16px; font-weight: 400; text-align: center; font-size: 16px; line-height: 1.2; margin-bottom: 16px; } @media (min-width: 992px){.seminar .details .time{ padding: 24px 16px; }} .seminar .details .time .session{ font-size: 24px; font-weight: 700; margin-bottom: 8px; } .seminar .details .main{ font-size: 20px; font-weight: 700; color: #1e283c; line-height: 1.5; margin-bottom: 16px; } @media (min-width: 768px){.seminar .details .main{ font-size: 24px; }} @media (min-width: 992px){.seminar .details .main{ font-size: 32px; }} .seminar .details .text{ font-size: 14px; line-height: 2; padding-bottom: 24px; border-bottom: 1px solid #d2d4d8; } @media (min-width: 992px){.seminar .details .text{ font-size: 16px; }} .seminar .details .profile{ padding-top: 24px; margin-bottom: 0; } .seminar .details .profile .portrait{ margin-bottom: 12px; } .seminar .details .profile .portrait img{ width: 50%; } @media (min-width: 768px){.seminar .details .profile .portrait img{ width: 25%; }} @media (min-width: 992px){.seminar .details .profile .portrait img{ width: 100%; max-width: 100%; }} .seminar .details .profile .name{ font-size: 18px; line-height: 1.2; font-weight: 700; margin-bottom: 12px; } .seminar .details .profile .position{ font-size: 12px; font-weight: 500; line-height: 1.2; color: #1e283c; } .seminar .details .profile .moderator{ font-size: 12px; color: #1e3c8c; margin-bottom: 6px; line-height: 1; } .seminar .details .profile p.history{ font-size: 12px; line-height: 1.8; } @media (min-width: 992px){.seminar .details .profile p.history{ font-size: 14px; }} .white-paper{ background: #fff; } .mw750{ max-width: 800px; margin: auto; padding: 40px 25px 40px; } @media (max-width: 767px){.mw750{ padding: 30px 25px 3px; }} .page .inquiry-description{ font-size: 16px !important; margin-bottom: 0 !important; } @media (min-width: 768px){.page .inquiry-description{ font-size: 18px !important; text-align: center; }} @media (max-width: 767px){.page .inquiry-description{ line-height: 2 !important; }} .padding-both .inquiry-container{ padding: 30px 25px !important; } @media (min-width: 768px){.padding-both .inquiry-container{ padding-top: 60px !important; padding-bottom: 60px !important; }} .post-paper.padding-both.no-vc{ background-color: #f4f6fA; } .inquiry-form-paper{ margin: 0 auto; max-width: 750px; padding: 24px; background-color: #fff; } @media (min-width: 768px){.inquiry-form-paper{ padding: 40px 40px; }} .inquiry-form-paper .form-title{ color: #1e3c8c; font-weight: 700; font-size: 18px; line-height: 1.5; margin-bottom: 24px; } @media (min-width: 768px){.inquiry-form-paper .form-title{ text-align: center; font-size: 20px; margin-bottom: 30px; }} .inquiry-form-paper p{ font-size: 12px !important; color: #a5a9b1 !important; line-height: 1.5 !important; margin-top: 16px !important; margin-bottom: 0px !important; } .inquiry-form-paper p.sf-note{ color: #4b5363 !important; margin-top: 32px !important; } .sf-form{ font-family: "Roboto", "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; } .sf-form .sf-field{ margin-top: 20px; } .sf-form .sf-field:first-of-type{ margin-top: 0; } .sf-form .sf-row{ margin-top: 20px; } @media (min-width: 768px){.sf-form .sf-row{ display: flex; gap: 20px; }.sf-form .sf-row .sf-field{ flex: 1; min-width: 0; margin-top: 0; }} .sf-form label{ display: block; color: #4b5363; font-size: 12px; font-weight: normal; line-height: 1.5; margin-bottom: 6px; } .sf-form label .required{ color: #b71c1c; margin-left: 3px; } .sf-form input:not([type="hidden"]):not([type="submit"]),.sf-form select,.sf-form textarea{ width: 100%; padding: 11px 10px; border: 1px solid #cbd6e2; border-radius: 0; background-color: #f5f8fa; color: #33475b; font-family: inherit; font-size: 16px; line-height: 1.4; } .sf-form input:not([type="hidden"]):not([type="submit"])::-webkit-input-placeholder,.sf-form textarea::-webkit-input-placeholder{ color: #99acc2; opacity: 1; } .sf-form input:not([type="hidden"]):not([type="submit"])::placeholder,.sf-form textarea::placeholder{ color: #99acc2; opacity: 1; } .sf-form input:not([type="hidden"]):not([type="submit"]):focus,.sf-form select:focus,.sf-form textarea:focus{ outline: none; border-color: #1e3c8c; } .sf-form input:not([type="hidden"]):not([type="submit"]),.sf-form textarea{ -webkit-appearance: none; appearance: none; } .sf-form textarea{ min-height: 120px; resize: vertical; } .sf-form .sf-field.has-error input:not([type="hidden"]):not([type="submit"]),.sf-form .sf-field.has-error select,.sf-form .sf-field.has-error textarea{ border-color: #b71c1c; } .sf-form .sf-error{ display: block; color: #b71c1c; font-size: 12px; line-height: 1.5; margin-top: 6px; } .sf-form .sf-recaptcha{ margin-top: 24px; display: flex; justify-content: center; } .sf-form .sf-recaptcha .g-recaptcha{ max-width: 100%; overflow: hidden; } .sf-form .sf-footer{ margin: 28px 0 0; text-align: center; } .sf-form input[type="submit"]{ -webkit-appearance: none; appearance: none; display: inline-block; min-width: 220px; padding: 14px 32px; border: none; border-radius: 60px; background-color: #1e3c8c; color: #fff; font-family: inherit; font-size: 18px; font-weight: 700; line-height: 1.2; cursor: pointer; transition: opacity 0.2s ease; } .sf-form input[type="submit"]:hover{ opacity: 0.85; } .sf-note{ font-size: 12px !important; color: #4b5363 !important; line-height: 1.5 !important; margin-top: 32px !important; margin-bottom: 0 !important; } .inquiry-complete-page .thanks{ padding: 60px 15px 60px; text-align: center; } .inquiry-complete-page .thanks p{ color: var(--fk-gray800); font-size: 16px; line-height: 2; margin-bottom: 48px; } @media (min-width: 768px){.inquiry-complete-page .thanks p{ font-size: 18px; }} .inquiry-complete-page .thanks p span{ color: var(--fk-gray600); font-size: 16px; line-height: 2; } @media screen and (max-width: 767px){.inquiry-complete-page .thanks{ padding: 40px 15px 40px; text-align: center; }.inquiry-complete-page .thanks p{ font-size: 16px !important; line-height: 2; padding: 0 25px; text-align: left; margin-bottom: 40px; }} .inquiry-complete-page .inquiry-container{ margin-bottom: 40px; } @media (min-width: 768px){.inquiry-complete-page .inquiry-container{ margin-bottom: 60px; }} .terms-page .terms-content{ padding: 60px 15px 100px; } .terms-page .terms-content ul{ background-color: #FFF; padding: 24px 16px; margin: 0; list-style: disc; } .terms-page .terms-content ul h4{ margin-bottom: 24px; padding-top: 16px; padding-left: 16px; font-size: 16px; } .terms-page .terms-content ul li{ padding: 12px 0; margin-left: 38px; } .terms-page .terms-content ul li a{ width: 150px; display: inline-block; } .ne-page{ min-height: 100vh; } .ne-page .ne-head{ height: 60px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 768px){.ne-page .ne-head{ height: 80px; }} .ne-page .ne-head img{ width: 160px; } @media (min-width: 768px){.ne-page .ne-head img{ width: 200px; }} .ne-page .ne-content h1{ color: #1e283c; font-size: 24px; line-height: 1.5; margin: 32px auto; text-align: center; } @media (min-width: 768px){.ne-page .ne-content h1{ font-size: 32px; margin: 60px auto; }} .ne-page .ne-content h1::after{ border-bottom: 3px solid #1e3c8c; content: ""; display: block; margin: 20px auto 0; width: 40px; } @media (min-width: 768px){.ne-page .ne-content h1::after{ width: 60px; }} .ne-page .ne-content .ne-text{ text-align: center; } .ne-page .ne-content .ne-text p{ max-width: 100%; font-size: 15px; line-height: 2; color: #4b5363; margin-bottom: 32px; padding: 0 16px; } @media (min-width: 768px){.ne-page .ne-content .ne-text p{ font-size: 18px; }} .ne-page .ne-content .ne-text p.caution{ border-top: 1px solid #a5a9b1; border-bottom: 1px solid #a5a9b1; padding: 16px; color: #787e8a; font-size: 14px; line-height: 1.5; margin: 0 auto 32px; } @media (min-width: 768px){.ne-page .ne-content .ne-text p.caution{ width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; font-size: 16px; }} .ne-page .ne-content .ne-text p.contact{ margin: 16px 0 0; padding-bottom: 32px; } .error-page{ background-color: #f4f4f5; min-height: 100vh; } .error-page .error-head{ height: 120px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .error-page .error-content{ height: calc(100vh - 120px); padding-bottom: 120px; } .error-page .error-anime{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 100%; } .error-page .error-anime img{ display: block; } .error-page .error-text{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; color: #1e3c8c; height: 100%; } .error-page .error-text .error-code{ font-size: 200px; font-weight: 900; } .error-page .error-text .error-status{ font-size: 50px; font-weight: 900; margin-bottom: 20px; } .error-page .error-text .error-message{ font-size: 18px; margin-bottom: 100px; } .error-page a.btn-toppage{ font-size: 16px; font-weight: bold; line-height: 1.5; padding: 16px 24px; color: #1e3c8c; border: #1e3c8c 2px solid; background-color: #f4f4f5; background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #f4f4f5)); background-image: linear-gradient(to right, transparent 50%, #f4f4f5 50%); background-size: 200% 100%; background-position: right bottom; } .error-page a.btn-toppage:hover{ background-color: #1e3c8c; background-position: left bottom; color: #fff; border-color: #1e3c8c; } @media screen and (max-width: 991px){.error-page .error-text .error-code{ font-size: 150px; font-weight: 900; }.error-page .error-text .error-status{ font-size: 36px; font-weight: 900; margin-bottom: 20px; }.error-page .error-text .error-message{ font-size: 14px; margin-bottom: 60px; }.error-page a.btn-toppage{ font-size: 14px; padding: 12px 32px; }} @media screen and (max-width: 767px){.error-page{ min-height: auto; }.error-page .error-head{ height: 80px; }.error-page .error-head img{ width: 180px; }.error-page .error-content{ height: auto; padding-bottom: 0px; }.error-page .error-anime img{ width: 80%; }.error-page .error-text{ padding-bottom: 80px; }.error-page .error-text .error-code{ font-size: 80px; font-weight: 900; margin-bottom: 20px; }.error-page .error-text .error-status{ font-size: 24px; font-weight: 900; margin-bottom: 10px; }.error-page .error-text .error-message{ margin-bottom: 40px; }} @keyframes fph-blobWave{ 0% { -webkit-transform: translate(0, 0) scale(1) rotate(0deg); transform: translate(0, 0) scale(1) rotate(0deg); } 33% { -webkit-transform: translate(10vw, -15vh) scale(1.2) rotate(45deg); transform: translate(10vw, -15vh) scale(1.2) rotate(45deg); } 66% { -webkit-transform: translate(-15vw, 10vh) scale(0.8) rotate(-45deg); transform: translate(-15vw, 10vh) scale(0.8) rotate(-45deg); } 100% { -webkit-transform: translate(5vw, 5vh) scale(1.1) rotate(15deg); transform: translate(5vw, 5vh) scale(1.1) rotate(15deg); } } @keyframes fph-fadeUp{ from { opacity: 0; -webkit-transform: translateY(50px); transform: translateY(50px); } to { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fph-bgFadeIn{ from { opacity: 0; } to { opacity: 1; } } /* theme-root.css */ :root{ --fk-navy: #1e3c8c; --fk-black: #1e283c; --fk-iceblue: #f5faff; --fk-icegray: #f4f6fA; --fk-cian: #00bcd4; --fk-blue: #2196f3; --fk-gray50: #f4f4f5; --fk-gray100: #e8e9eb; --fk-gray200: #d2d4d8; --fk-gray300: #bbbec4; --fk-gray400: #a5a9b1; --fk-gray500: #8e939d; --fk-gray600: #787e8a; --fk-gray700: #616876; --fk-gray800: #4b5363; --fk-gray900: #343d4f; } body{ font-family: "Roboto", "Noto Sans JP", sans-serif !important; font-weight: 400; font-size: 16px; line-height: 1; color: var(--fk-gray800); background-color: var(--fk-icegray); } /* menu-item-item.css */ /* rtoc.css */ .rtoc-mokuji-content{ width: 100%; max-width: 700px; font-size: 16px; font-weight: 400; margin: 40px auto; box-sizing: border-box; } .rtoc-mokuji-content.frame2{ width: 100%; position: relative; padding-bottom: 0.1px; } .rtoc-mokuji-content.frame2::before{ position: absolute; content: ""; border: 4px solid #111; width: 100%; height: 100%; box-sizing: border-box; top: 0; left: 0; opacity: 0.15; } .rtoc-mokuji-content #rtoc-mokuji-title{ padding: 32px 28px 8px; font-size: 1.35em; letter-spacing: 0; line-height: 1.8; } @media (min-width: 1024px){.rtoc-mokuji-content #rtoc-mokuji-title{ padding: 40px 64px 16px; font-size: 1.65em; }} .rtoc-mokuji-content #rtoc-mokuji-title.is_close{ padding: 32px; } @media (min-width: 1024px){.rtoc-mokuji-content #rtoc-mokuji-title.is_close{ padding: 40px 64px; }} .rtoc-mokuji-content #rtoc-mokuji-title.rtoc_left{ display: flex; text-align: left; align-items: center; flex-direction: row-reverse; justify-content: space-between; } .rtoc-mokuji-content .rtoc-mokuji{ padding: 0; margin: 0; } .rtoc-mokuji-content .rtoc-mokuji.level-1{ margin: 0 28px 32px !important; } @media (min-width: 1024px){.rtoc-mokuji-content .rtoc-mokuji.level-1{ margin: 0 64px 40px !important; }} .rtoc-mokuji-content .rtoc-mokuji{ padding: 0; margin: 0; list-style: none; transition: all 0.3s; } .rtoc-mokuji-content .rtoc-mokuji li{ position: relative; margin: 0 !important; line-height: 1.55; } .rtoc-mokuji-content .rtoc-mokuji li > a{ display: inline-block; position: relative; text-decoration: none; transition: all 0.3s; } .rtoc-mokuji-content .rtoc-mokuji li > a:hover{ text-decoration: underline; } .rtoc-mokuji-content .rtoc-mokuji.level-1 li{ font-size: 0.95em; list-style: none; } .rtoc-mokuji-content .rtoc-mokuji.level-1 li span{ font-size: 0.95em !important; } .rtoc-mokuji-content .rtoc-mokuji.level-2 li{ font-size: 0.9em; } .rtoc-mokuji-content .rtoc-mokuji.level-1{ padding-left: 1.3em; border: none !important; } .rtoc-mokuji-content .rtoc-mokuji.level-1.decimal_ol{ padding-left: 1.3em; } @media (max-width: 767px){.rtoc-mokuji-content .rtoc-mokuji.level-1{ padding-left: 1.5em; }} .rtoc-mokuji-content .rtoc-mokuji.level-1 li{ padding: 16px 0 0 0; } .rtoc-mokuji-content .rtoc-mokuji.level-1 .decimal_ol li::before{ top: 6px; } .rtoc-mokuji-content .rtoc-mokuji.level-2{ padding-left: 1.2em; padding-bottom: 4px !important; padding-top: 4px !important; margin-bottom: 0 !important; } @media (min-width: 1024px){.rtoc-mokuji-content .rtoc-mokuji.level-2{ padding-bottom: 0.75em !important; }} .rtoc-mokuji-content .rtoc-mokuji.level-2 li{ padding-top: 6px; } .rtoc-mokuji-content .rtoc-mokuji.level-2.decimal_ol{ padding-left: 1.25em; } .rtoc-mokuji-content .rtoc-mokuji.decimal_ol .level-2{ padding-left: 2.4em; } @media (min-width: 768px){.rtoc-mokuji-content .rtoc-mokuji.decimal_ol .level-2{ padding-left: 2.55em; }} @media (min-width: 768px){.rtoc-mokuji-content .rtoc-mokuji.decimal_ol .level-2.decimal_ol{ padding-left: 2.75em; }} .rtoc-mokuji-content .mokuji_ul .rtoc-item::after{ content: none; } .rtoc-mokuji-content .mokuji_ul > .rtoc-item::before{ width: 9px; height: 9px; position: absolute; content: ""; border-radius: 50%; top: 23px; left: -1.2em; } @media (max-width: 767px){.rtoc-mokuji-content .mokuji_ul > .rtoc-item::before{ top: 21px; }} .rtoc-mokuji-content .mokuji_ul > .rtoc-item::after{ content: none !important; } .rtoc-mokuji-content .mokuji_ul .mokuji_ul .rtoc-item::before{ position: absolute; content: ""; top: 12px; left: -1.2em; border-radius: 50%; } @media (max-width: 767px){.rtoc-mokuji-content .mokuji_ul .mokuji_ul .rtoc-item::before{ width: 6px; height: 6px; top: 12px; }} .rtoc-mokuji-content .rtoc-mokuji .mokuji_ul .rtoc-item::before{ width: 6px; height: 6px; top: 14px; } .rtoc-mokuji-content .decimal_ol{ padding-left: 0; counter-reset: rtoc-decimal-1; list-style: none; } .rtoc-mokuji-content .decimal_ol > .rtoc-item{ position: relative; counter-increment: rtoc-decimal-1; } .rtoc-mokuji-content .decimal_ol > .rtoc-item::after{ content: "" !important; position: absolute; top: 18px; left: 12px; right: auto; bottom: auto; height: 17px; width: 1px; border-radius: 1px; } @media (min-width: 768px){.rtoc-mokuji-content .decimal_ol > .rtoc-item::after{ top: 19px; }} .rtoc-mokuji-content .decimal_ol > .rtoc-item::before{ display: inline-block; content: counter(rtoc-decimal-1, decimal-leading-zero) ""; position: absolute; left: -1.3em; top: 16px; width: auto; height: auto; font-size: 1.05em; font-weight: normal; background-color: transparent !important; background: transparent; box-shadow: none; } .rtoc-mokuji-content .decimal_ol > .rtoc-item > a{ padding-left: 1.35em; } @media (min-width: 1024px){.rtoc-mokuji-content .decimal_ol > .rtoc-item > a{ padding-left: 1.65em; }} .rtoc-mokuji-content .decimal_ol .decimal_ol{ counter-reset: none; } .rtoc-mokuji-content .decimal_ol.level-2 > .rtoc-item{ counter-increment: rtoc-decimal-2; } .rtoc-mokuji-content .decimal_ol.level-2 > .rtoc-item::after{ width: 1px; height: 14px; top: 10px; left: 0.75em; } .rtoc-mokuji-content .decimal_ol.level-2 > .rtoc-item::before{ display: inline; content: counter(rtoc-decimal-2, decimal-leading-zero) ""; left: -1.2em; font-weight: normal; font-size: 0.95em; box-shadow: none; background: transparent; } .rtoc-mokuji-content .decimal_ol.level-2 > .rtoc-item > a{ padding-left: 1.65em; } .rtoc-mokuji-content .decimal_ol .mokuji_ul > .rtoc-item::before{ left: -1.15em; } .rtoc-mokuji-content.rtoc_close #rtoc-mokuji-title,.rtoc-mokuji-content.rtoc_open #rtoc-mokuji-title{ position: relative; } .rtoc-mokuji-content.rtoc_close #rtoc-mokuji-title .rtoc_open_close,.rtoc-mokuji-content.rtoc_open #rtoc-mokuji-title .rtoc_open_close{ box-sizing: content-box; padding: 8px 12px; font-size: 10px; height: 15px; line-height: 1; text-align: center; text-decoration: none; border: none; background-color: #f2f2f2; cursor: pointer; letter-spacing: 1px; } @media (max-width: 767px){.rtoc-mokuji-content.rtoc_close #rtoc-mokuji-title .rtoc_open_close,.rtoc-mokuji-content.rtoc_open #rtoc-mokuji-title .rtoc_open_close{ padding: 7px 10px; }} .rtoc-mokuji-content.rtoc_close #rtoc-mokuji-title .rtoc_open_close:focus,.rtoc-mokuji-content.rtoc_open #rtoc-mokuji-title .rtoc_open_close:focus{ outline: 0; } .rtoc-mokuji-content.rtoc_close #rtoc-mokuji-title.rtoc_left .rtoc_open_close,.rtoc-mokuji-content.rtoc_open #rtoc-mokuji-title.rtoc_left .rtoc_open_close{ left: calc(100% - 48px); } @media (min-width: 1024px){.rtoc-mokuji-content.rtoc_close #rtoc-mokuji-title.rtoc_left .rtoc_open_close,.rtoc-mokuji-content.rtoc_open #rtoc-mokuji-title.rtoc_left .rtoc_open_close{ left: calc(100% - 92px); }} .rtoc-mokuji-content.rtoc_close #rtoc-mokuji-title.rtoc_left.is_close .rtoc_open_close,.rtoc-mokuji-content.rtoc_open #rtoc-mokuji-title.rtoc_left.is_close .rtoc_open_close{ top: 50%; } .rtoc-mokuji-content.rtoc_close #rtoc-mokuji-title.is_close,.rtoc-mokuji-content.rtoc_open #rtoc-mokuji-title.is_close{ padding: 32px 28px; } @media (min-width: 1024px){.rtoc-mokuji-content.rtoc_close #rtoc-mokuji-title.is_close,.rtoc-mokuji-content.rtoc_open #rtoc-mokuji-title.is_close{ padding: 40px 64px; }} .rtoc-mokuji-content .level-1.is_close{ display: none !important; } .rtoc-mokuji-content.animation-fade{ animation: fadeIn 0.5s ease 0.4s; animation-fill-mode: both; } div[class^=cta-] #rtoc-mokuji-wrapper{ display: none; } @keyframes fadeIn{ 0% { opacity: 0; } 100% { opacity: 1; } } /* pixxy-dynamic.css */ .header_top_bg{ position: relative; z-index: auto; background-color: #ffffff; } header{ position: relative; width: 100%; z-index: 999; } .only_logo header{ text-align: center; } header a.logo{ text-decoration: none; display: block; } .header_trans-fixed.header_top_bg{ background-color: transparent; position: fixed; z-index: 1000; top: 0; width: 100%; } .header_trans-fixed.header_top_bg.open header .logo span,.header_trans-fixed.header_top_bg.open header .mob-nav i{ color: #222222; } .single-post .header_trans-fixed.bg-fixed-color{ margin-left: 0; width: 100%; } .top-menu{ padding-bottom: 10px; } .top-menu .logo{ display: inline-block; } .right-menu .logo span,.only_logo .logo span{ vertical-align: middle; text-align: left; font-size: 30px; line-height: 1.8; font-weight: 800; color: #222222; } .right-menu #topmenu{ text-align: right; } .header_top_bg.bg-fixed-color .top-menu .logo span,.header_top_bg.bg-fixed-color .right-menu #topmenu ul li ul li a,.header_top_bg.bg-fixed-color .right-menu #topmenu ul li a,.header_top_bg.bg-fixed-color .right-menu #topmenu .search-icon-wrapper i{ color: #222222; } #topmenu{ width: 100%; text-align: center; background: #ffffff; } #topmenu ul{ list-style: none; margin: 0; padding: 0; display: inline-block; font-family: 'Nunito Sans', sans-serif; } #topmenu ul li{ display: inline-block; position: relative; margin-left: 0; } #topmenu ul li a{ font-size: 15px; font-weight: 600; line-height: 2; color: #222222; display: block; text-align: left; text-decoration: none; padding: 0 20px; transition: all .3s ease; -webkit-font-smoothing: antialiased; } .header_trans-fixed.header_top_bg.open #topmenu ul li a{ color: #222222; } .top-menu #topmenu > ul > li > a{ padding: 0; } .top-menu .logo img{ max-height: 100px; } #topmenu ul ul{ position: absolute; z-index: 999; left: 0; top: 50px; min-width: 250px; display: none; box-sizing: border-box; } #topmenu ul ul li::before{ content: ''; display: table; clear: both; } #topmenu ul ul li a{ padding: 3px 30px; display: block; width: 100%; position: relative; -webkit-font-smoothing: antialiased; } #topmenu > ul > li > ul > li:hover ul{ display: block; } #topmenu > ul > li > ul > li > ul{ left: 101%; top: -15px; } .mob-nav{ display: none; width: 22px; height: 18px; margin: 0 auto 12px; font-size: 14px; color: #222222; opacity: 1; } .mob-nav:hover{ opacity: 0.7; } .right-menu .mob-nav .line{ width: 22px; height: 3px; background-color: #222222; display: block; float: left; margin: 2px auto; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .right-menu .mob-nav .hamburger{ display: inline-block; } .right-menu .mob-nav .hamburger i{ font-style: normal; font-size: 12px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; } .right-menu .mob-nav.active .line{ margin: 0; background-color: #222222; } .right-menu .mob-nav.active .line:nth-of-type(2){ opacity: 0; } .right-menu .mob-nav.active .line:nth-of-type(1){ width: 28px; -webkit-transform: translateY(4px) rotate(45deg); -ms-transform: translateY(4px) rotate(45deg); -o-transform: translateY(4px) rotate(45deg); transform: translateY(4px) rotate(45deg); } .right-menu .mob-nav.active .line:nth-of-type(3){ width: 28px; -webkit-transform: translateY(-2px) translateX(-4px) rotate(-45deg); -ms-transform: translateY(-2px) translateX(-4px) rotate(-45deg); -o-transform: translateY(-2px) translateX(-4px) rotate(-45deg); transform: translateY(-2px) translateX(-4px) rotate(-45deg); } .right-menu .mob-nav .line:nth-of-type(2){ width: 22px; } .right-menu .mob-nav .line:nth-of-type(1){ width: 18px; } .right-menu .mob-nav .line:nth-of-type(3){ width: 18px; margin-left: 4px; } header.simple{ display: flex; justify-content: space-between; align-items: center; padding: 24px 50px; } header.simple .mob-nav{ display: block; margin: 0; position: relative; z-index: 91; transform: none; top: 0; left: 0; } @media (max-width: 991px){header.simple{ padding: 15px 10px; }.search-icon-wrapper{ visibility: hidden; -webkit-transition: all 500ms ease; -moz-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; }.sidebar-open .search-icon-wrapper{ visibility: visible; }} @media only screen and (max-width: 991px){.header_top_bg{ position: fixed; top: 0; width: 100%; z-index: 100; }} .header_trans-fixed .mob-nav i{ color: #fff; } .header_trans-fixed.header_top_bg{ transition: background-color 300ms ease; } .header_trans-fixed.header_top_bg.bg-fixed-color{ background: rgba(255, 255, 255, 0.95); box-shadow: 0 4px 30px rgba(30, 60, 140, 0.1); } .header_trans-fixed.header_top_bg.bg-fixed-color .mob-nav .line{ background-color: #222; } .header_trans-fixed.header_top_bg.bg-fixed-color .logo span{ color: #222; } .right-menu .topmenu.open .mob-nav .line{ background-color: #222222; } #topmenu ul > li > ul > li > ul{ display: none; } header .logo img{ max-width: none; max-height: 75px; } header .logo img.logo-hover{ display: none; } header .logo:hover{ opacity: 1; } .header_trans-fixed .f-right > div:first-child::before{ background: #fff !important; } @media only screen and (min-width: 1801px){.header_top_bg > .container{ width: 1650px; }} @media (min-width: 992px){header .logo img.logo-mobile{ display: none!important; }.mob-nav-close{ display: none; }.header_trans-fixed #topmenu{ background-color: transparent; }#topmenu ul ul{ padding: 10px 0; }.right-menu .logo{ text-align: left; }.right-menu .logo{ display: table-cell; vertical-align: middle; }.top-menu #topmenu ul ul{ left: -20px; }#topmenu ul ul li{ display: block; margin-bottom: 5px; }#topmenu ul ul li:last-child{ margin-bottom: 0; }.top-menu #topmenu > ul:not(.social) > li{ margin: 0 10px 5px 10px; padding: 0; }#topmenu ul li:hover > ul{ display: block; }#topmenu .f-right > div{ position: relative; }#topmenu .f-right > div:last-child::before{ content: none; }#topmenu > ul > li > ul > li > ul{ left: -100%; top: -15px; }.sub-menu li a{ z-index: 1999; }.right-menu{ width: 100%; margin: auto; display: table; padding: 0; }.right-menu .f-right{ float: right; }.right-menu .f-right > div{ position: relative; }.right-menu .f-right > div:last-child::before{ content: none; }header:not(.full) .right-menu #topmenu{ text-align: center; display: table-cell !important; margin-top: 0; vertical-align: middle; }.header_trans-fixed.header_top_bg .right-menu:not(.static) #topmenu > ul > li > a{ transform: translateZ(0); }.header_trans-fixed.header_top_bg .right-menu #topmenu > ul ul{ top: 60px; }.header_trans-fixed.header_top_bg .right-menu #topmenu > ul ul ul{ top: -10px; }.right-menu #topmenu ul ul{ left: 10px; top: 44px; }.top-menu #topmenu ul ul{ left: -20px; top: 100%; }.right-menu #topmenu > ul > li > ul > li > ul{ left: 100%; top: -10px; }.top-menu #topmenu > ul > li > ul > li > ul{ left: 100%; top: -10px; }.right-menu #topmenu > ul > li > a{ position: relative; padding: 0; margin: 0 23px; }.right-menu #topmenu > ul > li.current-menu-item > a,.top-menu #topmenu > ul > li.current-menu-item > a,.right-menu #topmenu > ul > li.current-menu-parent > a,.top-menu #topmenu > ul > li.current-menu-parent > a{ transition: all 0.5s ease; }.right-menu .logo img{ max-height: 75px; margin: 5px auto; }.top-menu #topmenu > ul > li:last-child > ul > li > ul{ left: calc(-100% - 30px); }header.top-menu #topmenu ul ul{ left: 0; }.top-menu .logo span{ padding: 24px 10px; }header.top-menu .logo span{ padding: 15px 10px; }.right-menu .logo span{ float: left; }.top-menu #topmenu > ul:not(.social) > li{ margin: 0 0 5px; padding: 0 23px; }.top-menu #topmenu > ul > li:last-child > ul > li > ul{ left: calc(-100%); }.top-menu #topmenu > ul > li > ul > li > ul{ left: calc(100% + 23px); }} @media (min-width: 992px) and (max-width: 1199px){.right-menu #topmenu > ul > li > a{ margin: 0 18px; }} @media (max-width: 991px){.header_top_bg{ position: fixed; top: 0; width: 100%; z-index: 100; }header .logo img.main-logo:not(.logo-mobile){ display: none!important; }header .logo img.logo-mobile{ display: inline; padding: 10px 0; }.header_top_bg > .container{ width: 100%; }#topmenu{ overflow-x: hidden; }.main-wrapper{ width: 100%; }.main-wrapper header .logo img{ max-height: 75px; }header{ padding: 10px; }#topmenu ul li ul{ box-shadow: none; font-style: normal; }#topmenu ul{ box-shadow: none; font-style: normal; }.header_top_bg > .container > .row > .col-xs-12{ padding: 0; }.top-menu .logo{ margin-bottom: 0; margin-top: 0; }.right-menu #topmenu .menu li.menu-item-has-children,#topmenu .menu li.menu-item-has-children{ position: relative; text-align: left; }.right-menu #topmenu .menu li.menu-item-has-children i,#topmenu .menu li.menu-item-has-children i{ position: absolute; top: 19px; right: 28px; }.right-menu #topmenu .menu li.menu-item-has-children > a,#topmenu .menu li.menu-item-has-children > a{ position: relative; display: inline-block; width: auto!important; }.mob-nav{ display: block; margin: 0; position: absolute; top: 50%; right: 10px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }.mob-nav i::before{ font-size: 24px; }.sidebar-open{ height: 100vh; }.sidebar-open .header_top_bg{ position: fixed; }.main-wrapper{ left: 0; transition: all .5s ease-in-out; }.main-wrapper::before{ content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.75); z-index: 400; opacity: 0; visibility: hidden; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }.sidebar-open .main-wrapper{ left: 320px; overflow: visible; }.sidebar-open .main-wrapper::before{ opacity: 1; visibility: visible; }.mob-nav-close{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; text-decoration: none; border-bottom: 1px solid #f1f2f3; padding: 30px 0; }.mob-nav-close span{ font-size: 12px; text-transform: uppercase; }.mob-nav-close .hamburger{ padding: 0 20px; padding-left: 15px; }.mob-nav-close .line{ display: block; width: 24px; height: 2px; background-color: #222222; }.mob-nav-close .line:first-of-type{ -webkit-transform: rotate(45deg) translateY(2px); -moz-transform: rotate(45deg) translateY(2px); -ms-transform: rotate(45deg) translateY(2px); -o-transform: rotate(45deg) translateY(2px); transform: rotate(45deg) translateY(2px); }.mob-nav-close .line:last-of-type{ -webkit-transform: rotate(-45deg) translateY(-1px); -moz-transform: rotate(-45deg) translateY(-1px); -ms-transform: rotate(-45deg) translateY(-1px); -o-transform: rotate(-45deg) translateY(-1px); transform: rotate(-45deg) translateY(-1px); }#topmenu{ display: inline-block; overflow-y: auto; position: fixed; text-align: left; padding-top: 0; padding-bottom: 100px; top: 0; bottom: 0; width: 320px; left: -320px; background-color: #fff; height: 100vh; z-index: 100; transition: all .5s ease-in-out; }.sidebar-open #topmenu{ position: fixed; left: 0; }#topmenu ul ul{ display: none; position: static; }#topmenu ul.menu > li > ul > li > ul{ display: none; }#topmenu ul.menu{ width: 100%; display: inline-block; padding-bottom: 30px; background-color: #fff; }#topmenu ul.menu li{ display: block !important; float: none; text-align: left; margin-bottom: 0; }#topmenu ul.menu li a::before{ content: ''; position: absolute; bottom: 0; left: 0; width: 320px; height: 1px; display: block; background-color: #f1f2f3; }#topmenu ul.menu li a{ font-size: 16px; font-weight: 600; color: #222222; padding: 15px 35px 15px 25px; line-height: 25px; display: inline-block; width: auto!important; float: none; transition: all 0.5s ease; }#topmenu > ul.menu > li > ul > li,#topmenu > ul.menu > li > ul > li > ul > li{ padding-left: 10px; }#topmenu .menu li a:hover,#topmenu .menu .current-menu-parent > a,#topmenu .menu .current-menu-item > a,#topmenu .menu .current-menu-ancestor > a{ color: #0073e6; }header a.logo{ display: inline-block; }#topmenu .f-right{ display: block; background: #fff; padding: 15px; text-align: center; z-index: 9999; width: 100%; transition: all 350ms ease; }.header_trans-fixed.header_top_bg{ transition: none; }.header_trans-fixed.header_top_bg.open{ background-color: #fff; position: fixed; z-index: 1000; top: 0; width: 100%; }.header_trans-fixed .right-menu .mob-nav .hamburger i,.header_trans-fixed.bg-fixed-color .right-menu .mob-nav .hamburger i{ color: #222222; }.search-icon-wrapper{ display: block; position: relative; margin-bottom: 30px; }.search-icon-wrapper i{ position: absolute; top: 50%; right: 20px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }} @media only screen and (min-width: 992px){.container-fluid header.classic{ padding: 0 10px; }header.classic{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.classic #topmenu{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 35px; }.classic #topmenu .menu{ width: 100%; text-align: center; }.classic .f-right{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }.header_trans-fixed.header_top_bg .classic #topmenu ul li a{ padding: 0; }.classic #topmenu .menu li a{ color: #222222; font-size: 15px; font-weight: bold; line-height: 2; }.classic #topmenu .menu li a:hover,.classic #topmenu .menu .current-menu-parent > a,.classic #topmenu .menu .current-menu-item > a,.classic #topmenu .menu .current-menu-ancestor > a{ color: #0073e6; }.classic #topmenu .menu > li{ padding: 30px 0; }.classic #topmenu .sub-menu{ top: 75px; left: -35px; min-width: 270px; padding: 30px 0; background-color: #ffffff; -webkit-box-shadow: 3px 1px 20px 0 rgba(0, 115, 230, 0.08); box-shadow: 3px 1px 20px 0 rgba(0, 115, 230, 0.08); opacity: 0; visibility: hidden; -webkit-transition: opacity .3s ease, visibility .3s ease; -o-transition: opacity .3s ease, visibility .3s ease; transition: opacity .3s ease, visibility .3s ease; display: block; }.classic #topmenu .menu li:hover > ul{ opacity: 1; visibility: visible; }.classic #topmenu .menu > li ul a{ opacity: 0; -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); -webkit-transition: opacity .75s ease, color .5s ease, -webkit-transform .75s ease; transition: opacity .75s ease, color .5s ease, -webkit-transform .75s ease; -o-transition: opacity .75s ease, transform .75s ease, color .5s ease; transition: opacity .75s ease, transform .75s ease, color .5s ease; transition: opacity .75s ease, transform .75s ease, color .5s ease, -webkit-transform .75s ease; }.classic #topmenu .menu > li:hover ul a{ opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); }.classic #topmenu .sub-menu .sub-menu{ top: 0; left: 100%; padding: 40px 15px; }.classic #topmenu .menu li:last-of-type .sub-menu .sub-menu,.classic #topmenu .menu li:nth-last-of-type(2) .sub-menu .sub-menu,.classic #topmenu .menu li:nth-last-of-type(3) .sub-menu .sub-menu,.classic #topmenu .menu li:nth-last-of-type(4) .sub-menu .sub-menu{ left: auto; right: 100%; }.classic #topmenu .sub-menu li{ padding: 8px 35px; text-align: left; }.classic #topmenu .sub-menu li a{ width: auto; display: inline-block; padding: 0; }.classic #topmenu .current-menu-parent > a,.classic #topmenu .current-menu-item > a{ position: relative; }.classic #topmenu > ul > li > a{ margin: 0 45px 0 0; }.classic #topmenu .search-icon-wrapper{ margin-left: 10px; cursor: pointer; font-size: 27px; color: #222; line-height: 1; }.classic #topmenu .search-icon-wrapper:hover{ color: #888; }} @media only screen and (min-width: 992px) and (max-width: 1240px){.classic #topmenu > ul > li > a{ margin: 0 30px 0 0; }} @media only screen and (min-width: 1201px){.container-fluid header.classic{ padding: 0 85px; }} a{ } #topmenu > ul > li > a{ font-family: "Noto Sans", sans-serif !important; font-size: 14px; } #topmenu ul ul li a{ font-family: "Noto Sans", sans-serif !important; font-size: 14px; } /* rtoc-inline.css */ .rtoc-mokuji-content{ background-color: #ffffff; } .rtoc-mokuji-content #rtoc-mokuji-title{ color: #3f9cff; } .rtoc-mokuji-content .rtoc-mokuji li>a{ color: #555555; } .rtoc-mokuji-content .mokuji_ul.level-1>.rtoc-item::before{ background-color: #3f9cff !important; } .rtoc-mokuji-content .mokuji_ul.level-2>.rtoc-item::before{ background-color: #3f9cff !important; } .rtoc-mokuji-content.frame2::before{ border-color: #3f9cff !important; } .rtoc-mokuji-content .decimal_ol.level-2>.rtoc-item::before,.rtoc-mokuji-content .decimal_ol.level-2>.rtoc-item::after,.rtoc-mokuji-content .decimal_ol.level-2>.rtoc-item::after{ color: #3f9cff; background-color: #3f9cff; } .rtoc-mokuji-content .rtoc-mokuji.level-1>.rtoc-item::before{ color: #3f9cff; } .rtoc-mokuji-content .decimal_ol>.rtoc-item::after{ background-color: #3f9cff; } .rtoc-mokuji-content .decimal_ol>.rtoc-item::before{ color: #3f9cff; } /* overrides.css */ .logo-hover{display:none} .header_trans-fixed.bg-fixed-color .logo-hover{display:inline} .header_trans-fixed.bg-fixed-color .main-logo{display:none} @media (max-width:991px){#topmenu .menu .sub-menu.is-open{display:block}} .sf-field.sf-consent label{display:flex;align-items:center;gap:8px;margin:0;font-weight:400;cursor:pointer} .sf-form .sf-field.sf-consent input[type="checkbox"]{-webkit-appearance:checkbox;appearance:auto;flex:0 0 auto;width:18px;height:18px;margin:0;padding:0;border:0;background:none;accent-color:#1e3c8c;cursor:pointer} .post-link-card{margin:30px 0} .post-link-card a{display:block;padding:16px 20px;border:1px solid #d2d4d8;border-radius:8px;background:#fff;text-decoration:none;color:#1e283c;transition:.2s} .post-link-card a:hover{border-color:#1e3c8c;box-shadow:0 4px 16px rgba(30,60,140,.12)} .post-link-card__label{display:block;margin-bottom:6px;font-size:12px;color:#8e939d} .post-link-card__title{display:block;font-size:16px;font-weight:700;line-height:1.6} .fluid-width-video-wrapper{width:100%;position:relative;padding:0} .fluid-width-video-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%} .error-page .error-content{height:auto;min-height:calc(100vh - 120px)} .error-page .error-anime,.error-page .error-text{min-height:calc(100vh - 240px)} .error-page .error-anime img{max-width:100%;height:auto} @media (max-width:767px){.error-page .error-content{min-height:0}.error-page .error-anime,.error-page .error-text{min-height:0}} .rtoc-mokuji-content #rtoc-mokuji-title .rtoc_open_close{color:#666} .wp-page .wp-list .row{display:flex;flex-wrap:wrap} .wp-page .wp-list .row::before,.wp-page .wp-list .row::after{display:none} .wp-page .wp-list .row>[class*="col-"]{display:flex} .wp-page .wp-list .row>[class*="col-"]>.inner{flex:1} @media (max-width:767px){.wp-page .wp-list .row>[class*="col-"]{width:100%}}