﻿﻿/*!
Theme Name:20231130 Theme of senoweb.jp
Description:セーノのWPテーマ
Author: コンティ
Author URI: https://senoweb.jp/
Version: 2.0
*/
article, aside, canvas, details, figcaption, figure, footer, header, main, hgroup, menu, nav, section, summary, main {
    display: block
}

body, form, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, blockquote, input, dl, dd, dt, div, address, label {
    margin: 0;
    padding: 0
}

a img, img {
    border: 0
}

li {
    list-style: none
}

ol {
    counter-reset: item
}

ol li {
    list-style-type: none;
    margin-left: 0px
}

ol li:before {
    counter-increment: item;
    content: counter(item, decimal-leading-zero)
}

em {
    font-style: normal;
    font-weight: bold
}

address {
    font-style: normal;
    font-weight: normal
}

form, input, select, textarea, button {
    margin: 0 2px 0 0;
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W6", "HIragino Kaku Gothic Pro W6", "HIragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
    padding: 1px;
    color: #404040;
    font-size: 100%
}

*:first-child+html form, *:first-child+html input, *:first-child+html select, *:first-child+html textarea {
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W6", "HIragino Kaku Gothic Pro W6", "HIragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif
}

body {
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W6", "HIragino Kaku Gothic Pro W6", "HIragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    text-align: center
}

*:first-child+html body {
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W6", "HIragino Kaku Gothic Pro W6", "HIragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif
}

table {
    line-height: 1.5;
    text-align: left
}

*:first-child+html table {
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W6", "HIragino Kaku Gothic Pro W6", "HIragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif
}

h1, h2, h3, h4, h5, h6 {
    font-size: small
}

a {
    color: #201612;
    font-weight: bold;
    background-color: transparent;
    text-decoration: none
}

a:hover, a:hover img {
    opacity: 0.7;
    background-color: transparent;
    text-decoration: none
}

a:visited {
    text-decoration: underline
}

.text-right {
    text-align: right
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.clear {
    clear: both
}

.clearbox:after {
    content: "";
    display: block;
    clear: both;
    height: 0px
}

.clearbox {
    height: 100%
}

.top5 {
    margin-top: 5px
}

.top10 {
    margin-top: 10px
}

.top20 {
    margin-top: 20px
}

.top30 {
    margin-top: 30px
}

.top40 {
    margin-top: 40px
}

.top50 {
    margin-top: 50px
}

.p-top10 {
    padding-top: 20px
}

.p-top20 {
    padding-top: 20px
}

.bottom5 {
    margin-bottom: 5px
}

.bottom10 {
    margin-bottom: 10px
}

.bottom15 {
    margin-bottom: 15px
}

.bottom20 {
    margin-bottom: 20px
}

.bottom30 {
    margin-bottom: 30px
}

.bottom40 {
    margin-bottom: 40px
}

.bottom50 {
    margin-bottom: 50px
}

.bottom60 {
    margin-bottom: 60px
}

.bottom80 {
    margin-bottom: 80px
}

.bottom250 {
    margin-bottom: 250px
}

.left10 {
    margin-left: 10px
}

.left20 {
    margin-left: 20px
}

.left50 {
    margin-left: 50px
}

.left80 {
    margin-left: 80px
}

.left15 {
    margin-left: 15px
}

.right5 {
    margin-right: 5px
}

.right10 {
    margin-right: 10px
}

.right20 {
    margin-right: 20px
}

.right15 {
    margin-right: 15px
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

.clearfix {
    display: inline-block
}

* html .clearfix {
    height: 1%
}

.clearfix {
    display: block
}

.clearfix2:after {
    content: " ";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0.1px;
    font-size: 0.1em;
    line-height: 0
}

*1257897500* html .clearfix2 {
    display: inline-block
}

*1257897501* html .clearfix2 {
    height: 1%
}

.pkg {
    display: block
}

* html .hollyhack {
    height: 1%
}

.red {
    color: #F00
}

.red-bold {
    color: #bc312e;
    font-weight: bold
}

.blue {
    color: #54bedc
}

.blue-bold {
    color: #263d79;
    font-weight: bold
}

.pink {
    color: #df6182
}

.green {
    color: #2a9968
}

.gray {
    color: #777777
}

.orange {
    color: #fe9704
}

.yellow {
    font-weight: bold;
    color: #FFFF66;
    font-size: 12px
}

table {
    width: 100%;
    border-top: 1px dashed #e4e4e4;
    border-right: 1px dashed #e4e4e4
}

table th {
    background: #f4f4f4
}

table td, table th {
    padding: 16px;
    border-bottom: 1px dashed #e4e4e4;
    border-left: 1px dashed #e4e4e4;
    overflow-wrap: break-word
}

table.none {
    border: none;
    margin: 0 auto
}

table.none td, table.none th {
    border-bottom: none;
    border-right: none;
    padding: 0 3px
}

.font30 {
    font-size: 30px;
    font-weight: bold
}

.font24 {
    font-size: 24px;
    font-weight: bold
}

.font16 {
    font-size: 16px
}

.font18 {
    font-size: 18px
}

.font14 {
    font-size: 14px
}

.font12 {
    font-size: 12px
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box
}

@font-face {
    font-family: "Montserrat";
    src: url("https://fonts.googleapis.com/css?family=Montserrat") format("woff")
}

@font-face {
    font-family: "nsjpr";
    font-style: normal;
    font-weight: 400;
    src: url("notosansjp/NotoSansJP-Regular-s.woff") format("woff")
}

@font-face {
    font-family: "nsjpr";
    font-style: normal;
    font-weight: 700;
    src: url("notosansjp/NotoSansJP-Bold-s.woff") format("woff")
}

html, body {
    overflow-x: hidden;
    overflow-y: auto
}

body {
    font-family: "Montserrat", "nsjpr", "Noto Sans", sans-serif;
    text-align: left;
    color: #000;
    font-size: 16px;
    line-height: 1.8;
    position: relative;
    width: 100%;
    overflow-x: hidden;
    padding-top: 76px
}

.pc-hyde {
    display: none
}

figure {
    margin: 0
}

.line0 {
    line-height: 0
}

::selection {
    background: #e0f5ff
}

::placeholder {
    color: #c7c7c7
}

.mustcenter {
    margin: 0 auto !important
}

.font-nomal {
    font-weight: normal
}

.overflow-hidden {
    overflow: hidden
}

.textwidget, .textwidget p {
    display: inline !important
}

.iframe iframe {
    max-width: 100%
}

#toggle {
    display: none
}

a .fa {
    color: #2a9968;
    font-size: 24px;
    vertical-align: middle
}

img {
    max-width: 100%;
    height: auto
}

input[type="text"], input[type="email"], input[type="tel"], textarea {
    width: 100%;
    padding: 10px;
    border: none;
    background: #f6f6f6
}

textarea {
    height: 244px
}

#toc_container {
    padding: 30px !important;
    border: none !important;
    line-height: 2.5 !important;
    margin-top: 3em !important;
    margin-bottom: 3em !important
}

#toc_container a {
    font-weight: normal !important
}

.ico-type--center {
    text-align: center;
    margin: 20px 0
}

.ico-fa {
    font-size: 36px
}

.bg-gray {
    background: #f4f4f4
}

.bg-gray-type--arrow {
    position: relative
}

.bg-gray-type--arrow:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 30px 0 30px;
    border-color: #ffffff transparent transparent transparent
}

.bg-gray-type--dark {
    background: #ddd
}

.bg-gray .step__title-squareheading {
    background: #fff !important
}

.bg-white {
    background: #fff
}

.wide {
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%)
}

.container {
    padding-top: 100px;
    padding-bottom: 100px;
    position: relative
}

.container-type--mini {
    padding-top: 60px;
    padding-bottom: 60px
}

.container-type--mini .section__title {
    font-size: 40px
}

.container-type--mini .title-type--en {
    margin-bottom: 30px
}

.container-type--mini .title-type--en:after {
    display: none
}

.container-type--mini .title-type--en:before {
    content: "";
    display: block;
    position: relative;
    background: url(img/dot.svg) no-repeat left;
    background-size: contain;
    width: 86px;
    height: 13px;
    opacity: .5;
    margin-bottom: 50px;
    margin-top: -68px
}

.container-type--footnav {
    background: #000;
    color: #fff;
    padding-top: 50px;
    padding-bottom: 50px
}

.container-type--tiles {
    background: url(img/tiles.jpg);
    color: #fff;
    font-size: 14px
}

.container-type--tiles .item__title {
    color: #fff;
    text-align: left !important
}

.container-type--tiles .item__title img {
    vertical-align: middle;
    margin-bottom: 16px;
    margin-right: 16px;
    height: 46px;
    width: auto
}

.container-type--tiles .item__title-link {
    color: #fff
}

.container-type--tiles .ico-fa {
    display: inline-block
}

.container-type--tiles .ico-fa-link {
    color: #fff
}

.container-type--tiles .ico-fa:not(:first-of-type) {
    margin-left: 10px
}

.container-type--tiles .section__title {
    font-size: 40px
}

.container-type--tiles .section__title:after {
    content: "";
    display: block;
    position: relative;
    background: url(img/dot.svg) no-repeat left;
    background-size: contain;
    width: 86px;
    height: 13px;
    opacity: .5;
    margin-top: 33.33333px
}

.container-type--tiles .section__subtitle {
    padding: 0
}

.container-type--tiles .btn {
    width: 100%
}

.container-type--bgtitlegray {
    position: relative
}

.container-type--bgtitlegray:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: -35%;
    background: #f4f4f4;
    width: 100%;
    height: 80%;
    z-index: -1
}

.container-type--bgleftgray {
    padding-top: 0
}

.container-type--bgleftgray .wrapper {
    position: relative;
    background: #f4f4f4;
    padding: 100px 0
}

.container-type--bgleftgray .wrapper:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: -100%;
    background: #f4f4f4;
    width: 200%;
    height: 100%;
    z-index: -1;
    margin-right: 20%;
}

.container-type--bgrightgray {
    padding-top: 0
}

.container-type--bgrightgray .wrapper {
    position: relative;
    background: #f4f4f4;
    padding: 100px 0
}

.container-type--bgrightgray .wrapper:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: -100%;
    background: #f4f4f4;
    width: 200%;
    height: 100%;
    z-index: -1;
    margin-right: 20%;
}

.sub-container {
    padding-bottom: 50px
}

.sub-container-type--step {
    position: relative;
    padding-left: 40px
}

.sub-container-type--step:before {
    content: "";
    width: 8px;
    height: 8px;
    display: block;
    border-radius: 500px;
    -webkit-border-radius: 500px;
    -moz-border-radius: 500px;
    background: #000;
    position: absolute;
    top: 16px;
    left: 0;
    z-index: 1
}

.sub-container-type--step:first-of-type {
    margin-top: 50px
}

.sub-container-type--step:not(:last-of-type) {
    padding-bottom: 50px
}

.sub-container-type--step:not(:last-of-type):after {
    content: "";
    width: 2px;
    height: 100%;
    background: #ddd;
    position: absolute;
    top: 16px;
    left: 3px
}

.sub-container-type--step:last-of-type {
    padding-bottom: 0
}

.sub-container-type--step .step__title {
    font-size: 24px;
    margin-bottom: 20px
}

.sub-container-type--step .step__title-squareheading {
    background: #f4f4f4;
    padding: 0 0 0 8px;
    display: inline-block;
    margin-right: 20px
}

.sub-container-type--step .step__title-squareheading-num {
    display: inline-block;
    padding: 0 6px;
    margin-left: 6px;
    background: #000;
    color: #fff
}

.wrapper {
    max-width: 1100px;
    width: 92%;
    margin: 0 auto
}

.sub-wrapper {
    max-width: 850px;
    width: 100%;
    margin: 0 auto
}

.box {
    padding: 50px
}

.box-type--border {
    border: solid 2px #ddd;
    padding: 20px;
    background: #fff
}

.box-type--borderbold {
    padding: 25px;
    border: solid #eee 6px;
    background: #fff
}

.box-type--panel {
    padding: 0;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.box-type--panel .mockup__pc {
    background: url(img/mockup--pc.png) no-repeat center top;
    background-size: contain;
    height: 280px !important
}

.box-type--panel .mockup__pc .mockup__window {
    width: 91;
    height: auto;
    top: 00px;
    margin: 0 auto;
    left: 0;
    right: 0
}

.box-type--panel .panel__item {
    width: 50%;
    padding: 40px;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.box-type--panel .panel__item .btn {
    width: 100%
}

.box-type--panel .panel__item .mockup__pc {
    height: auto !important
}

.box-type--panel .panel__item .mockup__pc:before {
    content: "";
    display: block;
    padding-top: 86%
}

.box-type--panel .panel__text .section__title {
    margin-bottom: 10px;
    font-size: 22px
}

.box-type--panel .panel__text .btn {
    margin-top: 20px
}

.box-type--thumb {
    display: table;
    width: 100%
}

.box-type--thumb .squarethumb {
    padding-right: 25px
}

.box-type--thumb .item {
    display: table-cell;
    vertical-align: top
}

.box-type--thumb .item__text {
    padding-top: 25px
}

.box-type--formarea {
    padding: 50px;
    background: #fff;
    box-shadow: 0 0 10px #ddd
}

.box-type--formarea .red {
    display: inline-block;
    font-size: 14px;
    padding: 0 8px
}

.box-type--formarea .btn {
    border: none
}

.box-type--formarea .btn:hover {
    opacity: .8;
    cursor: pointer
}

.box-type--faq {
    padding: 33.33333px;
    background: #fff;
    box-shadow: 0 0 10px #ddd
}

.box-type--faq:not(:first-of-type) {
    margin-top: 33.33333px
}

.box-type--faq .box {
    padding: 33.33333px
}

.box-type--num {
    position: relative;
    border-top: 4px solid #000;
    padding-top: 50px;
    padding-bottom: 50px
}

.box-type--num .squarenum {
    background: #000;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    padding: 6px;
    display: block;
    position: absolute;
    top: -2px;
    left: -2px;
    width: 1.8em;
    height: 1.8em;
    text-align: center;
    line-height: 1
}

.box-type--simple {
    font-size: 14px
}

.box-type--simple .section__title {
    margin-bottom: 0;
    line-height: 1.5
}

.vmiddle {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 9
}

.flexbox {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.flexbox.col2>.item {
    width: 48.5%
}

.flexbox.col2>.item:nth-of-type(n+3) {
    margin-top: 20px
}

.flexbox.col2>.item .item {
    font-size: 14px
}

.flexbox.col2>.item .squarethumb__text {
    font-size: 14px
}

.flexbox.col2>.item .squarethumb__title {
    font-size: 16px
}

.flexbox.col3>.item {
    width: 32%
}

.flexbox.col3>.item:nth-of-type(n+4) {
    margin-top: 20px
}

.flexbox.col3>.item .btn {
    width: 100%;
    margin-top: 0
}

.flexbox.col3>.item.double {
    width: 64%
}

.flexbox.col4>.item {
    width: 24%;
    font-size: 14px
}

.flexbox.col4>.item:nth-of-type(n+5) {
    margin-top: 20px
}

.flexbox.col5>.item {
    width: 18%
}

.flexbox.col6>.item {
    width: 16%
}

.flexbox.start {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.flexbox.start>.item:last-of-type {
    margin-right: 0
}

.flexbox.start.col3>.item {
    width: 31%;
    margin-right: 1%;
    margin-left: 1%
}

.flexbox.start.col4>.item {
    margin-right: 1%
}

.flexbox.start.col5>.item {
    margin-right: 1%;
    margin-left: 1%
}

.flexbox.balance>.item {
    flex: 1
}

.flexbox .item__title {
    line-height: 1.5;
    text-align: center;
    font-size: 18px;
    margin-bottom: 20px
}

.flexbox .item__img {
    line-height: 0
}

.flexbox .item__img img {
    width: 100%
}

.frontstrength {
    padding-top: 200px;
    padding-bottom: 50px
}

.frontstrength .flexbox.col2 {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.frontstrength .bg-gray {
    position: relative;
    padding: 100px 0 125px
}

.frontstrength .bg-gray:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: -100%;
    background: #f4f4f4;
    width: 200%;
    height: 100%;
    z-index: -2
}

.frontstrength .bg-gray .img-type--right0 img {
    width: 50vw;
    max-width: none;
    min-height: 100%
}

@media all and (min-width: 1500px) {
    .frontstrength .bg-gray .img-type--right0 img {
        height: 600px;
        object-fit: cover
    }
}

.frontstrength:after {
    content: "";
    display: block;
    position: absolute;
    right: 2vw;
    bottom: -14vw;
    background: url(img/kanagawa.png) no-repeat center center;
    background-size: contain;
    width: 26vw;
    height: 22vw
}

.frontstrength__logo {
    position: absolute;
    top: -138px;
    left: -5%;
    width: 100%;
    text-align: right;
    z-index: 9
}

.frontstrength__logo img {
    position: relative;
    display: block;
    right: 0;
    top: 0;
    width: 105%;
    height: auto;
    max-width: none;
    opacity: .1;
    margin-left: auto
}

.frontstrengthslide {
    position: absolute !important;
    display: block;
    bottom: -74px;
    left: 0;
    width: 75%
}

.frontstrengthslide .slick-list {
    margin-left: -20px
}

.frontstrengthslide .slide-arrow {
    display: block;
    background: #000;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 500px;
    -webkit-border-radius: 500px;
    -moz-border-radius: 500px;
    box-shadow: 0 0 10px #ddd;
    position: absolute;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.frontstrengthslide .slide-arrow:hover {
    cursor: pointer
}

.frontstrengthslide .slide-arrow.prev-arrow {
    padding-right: 2px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: -50px;
    z-index: 9
}

.frontstrengthslide .slide-arrow.prev-arrow:before {
    position: relative;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6.5px 8px 6.5px 0;
    border-color: transparent #ffffff transparent transparent;
    margin: 0 auto !important
}

.frontstrengthslide .slide-arrow.next-arrow {
    padding-left: 2px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: -50px;
    z-index: 9
}

.frontstrengthslide .slide-arrow.next-arrow:before {
    position: relative;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6.5px 0 6.5px 8px;
    border-color: transparent transparent transparent #ffffff;
    margin: 0 auto !important
}

@media all and (-ms-high-contrast: none) {
    .frontstrengthslide .slide-arrow {
        display: none !important
    }
}

.frontstrengthslide__item {
    position: relative;
    margin-left: 20px;
    overflow: hidden
}

.frontstrengthslide__item-link {
    display: block;
    position: relative
}

.frontstrengthslide__item-link:hover {
    opacity: 1
}

.frontstrengthslide__item-link:before {
    content: "";
    position: absolute;
    width: 150%;
    height: 150%;
    display: block;
    background: rgba(255, 255, 255, 0.8);
    -moz-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    z-index: 9;
    top: 30%;
    left: -50%
}

.frontstrengthslide__item-link:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    background: rgba(0, 0, 0, 0.6);
    -moz-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    -ms-transform: rotate(-30deg);
    z-index: 9;
    top: -70%;
    left: -50%
}

.frontstrengthslide__item .frontstrengthslide__text {
    position: absolute;
    display: block;
    width: 100%;
    left: 20px;
    bottom: 16px;
    z-index: 99
}

.frontstrengthslide__item .frontstrengthslide__title {
    font-size: 18px;
    line-height: 1.5
}

.frontnote {
    background: url(img/senotekv__bg.jpg) no-repeat center center;
    background-size: cover;
    border-bottom: 4px solid #f4f4f4;
    border-top: 4px solid #f4f4f4
}

.frontworks {
    padding-bottom: 0;
    overflow: hidden
}

.frontworks__inner {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.frontworks__inner .mockup {
    width: 565px
}

.frontworks .col2 {
    width: 450px
}

.frontworks .bg-gray {
    position: relative;
    padding: 60px 0 50px 50px
}

.frontworks .bg-gray:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: -100%;
    background: #f4f4f4;
    width: 200%;
    height: 100%;
    z-index: -1
}

.frontworksmenu {
    background: #ddd;
    width: 100vw
}

.frontworksmenu__item {
    display: inline-block;
    position: relative
}

.frontworksmenu__item:not(:last-child):not(:first-child):after {
    content: "/";
    display: inline-block;
    padding: 0 0.5em;
    color: #313131
}

.frontworksmenu__item-link {
    font-weight: normal;
    padding: 10px 0
}

.frontworksmenu__item .btn {
    display: inline-block;
    width: auto;
    margin: 0 10px 0 0
}

.frontvoice {
    padding-bottom: 24px
}

.frontvoice .bg-gray {
    padding-bottom: 100px
}

.frontvoice .wrapper {
    position: relative
}

.frontvoice .slidearea {
    border-top: 8px solid #f4f4f4
}

.frontvoice .slidearea .slick-list a {
    position: relative;
    display: block
}

.frontvoice .slidearea .slick-list a:hover {
    opacity: 1
}

.frontvoice .slidearea .slick-list a:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(90deg, #ffb901 20.79688%, #fcb803 20.79688%, #02a4ef 41.92188%, #03a4eb 41.92188%, #7fba00 61.67188%, #80b800 61.67188%, #f25022 80.79688%);
    opacity: .2;
    z-index: 99999
}

.frontvoice .slidearea .slick-list a:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url(img/dot-w.png);
    opacity: .5;
    z-index: 9999
}

.frontvoice .slidearea .slide {
    line-height: 0
}

.frontvoice .slidearea img {
    width: 100%;
    opacity: .8
}

.frontvoice .slidethumb {
    width: 100%;
    position: relative;
    margin-top: -88px
}

.frontvoice .slidethumb .slick-track {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.frontvoice .slidethumb__item {
    width: 18% !important
}

.frontvoice .btn {
    position: absolute;
    bottom: -124px;
    margin: 0 auto;
    left: 0;
    right: 0
}

.frontguide .section__title {
    line-height: 1;
    margin-bottom: 0
}

.frontguide .section__title:after {
    display: none
}

.frontguide .section__subtitle {
    padding: 0
}

.frontguide .wrapper>.col2>.item {
    width: 48%
}

.frontguide .wrapper>.col2>.item:first-of-type {
    position: relative
}

.frontguide .wrapper>.col2>.item:first-of-type:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: -20px;
    background: url(img/dot-y.svg) no-repeat center center;
    background-size: 100% auto;
    width: 10px;
    height: 100%;
    opacity: .5
}

.mockup {
    text-align: center
}

.mockup-ico {
    text-align: center;
    position: relative
}

.mockup-ico__num {
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    position: absolute;
    display: block;
    top: 10px;
    left: 0;
    right: 0;
    margin: 0 auto
}

.mockup-ico img {
    height: 76px;
    width: auto;
    margin: 0 auto
}

.mockup__sp {
    display: block;
    width: 100%;
    background: url(img/mockup--sp.png) no-repeat center center;
    background-size: contain;
    height: 453px;
    position: relative
}

.mockup__spwindow {
    position: absolute;
    width: 180px;
    height: 322px;
    overflow-y: scroll;
    top: 66px;
    left: 21px;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.mockup__spwindow::-webkit-scrollbar {
    display: none
}

.mockup__pc {
    width: 100%;
    background: url(img/mockup--pc.png) no-repeat top center;
    background-size: contain;
    height: 492px;
    position: relative
}

.mockup__pc-type-circlelabel {
    position: relative
}

.mockup__pc-type-circlelabelitem {
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    position: absolute;
    width: 80px;
    height: 80px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    border-radius: 500px;
    -webkit-border-radius: 500px;
    -moz-border-radius: 500px;
    background: rgba(255, 57, 178, 0.8);
    z-index: 9;
    top: -30px;
    left: -30px;
    border: 5px solid #ff9fd9;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-name: borderweight
}

@keyframes borderweight {
    0% {
        border: 5px solid #ff9fd9
    }

    50% {
        border: 5px solid #fd5ebf
    }

    100% {
        border: 5px solid #ff9fd9
    }
}

.mockup__window {
    position: absolute;
    width: 91%;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto
}

.mockup__window:before {
    padding-top: 56.25%;
    content: "";
    display: block
}

.mockup__img {
    line-height: 0;
    position: absolute;
    overflow-y: scroll;
    height: 100%;
    top: 8%;
    left: 0;
    right: 0;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.mockup__img::-webkit-scrollbar {
    display: none
}

.mockup__img img {
    width: 100%
}

.mockup__title {
    font-size: 30px
}

.mockup__subtitle {
    font-weight: normal
}

.squarethumb {
    text-align: center
}

.squarethumb__img {
    border: 8px solid #fff;
    line-height: 0;
    box-shadow: 0 0 10px #ddd
}

.squarethumb__img-type--circle {
    border-radius: 500px;
    -webkit-border-radius: 500px;
    -moz-border-radius: 500px;
    overflow: hidden
}

.squarethumb__img img {
    width: 100%
}

.squarethumb__title {
    padding-top: 10px;
    font-size: 18px;
    line-height: 1.5
}

.squarethumb__subtitle {
    font-weight: normal
}

.squarethumb-type--overflow {
    position: absolute;
    top: -20px;
    right: 0
}

.squarethumb-type--mini {
    width: 170px;
    height: 170px
}

.dist {
    list-style-type: disc;
    margin-left: 1em
}

.dist__item {
    padding-left: 16px;
    position: relative;
    list-style-type: disc
}

.btn {
    display: block;
    margin-top: 33.33333px;
    background: #000;
    color: #fff;
    text-align: center;
    width: 33%;
    padding: 10px 20px;
    min-width: 180px;
    position: relative;
    font-weight: normal
}

.btn:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 6%;
    width: 8px;
    height: 8px;
    background: url(img/arrow-w.svg) no-repeat center center;
    z-index: 9;
    background-size: contain
}

.btn-type--twitter {
    background: #59aeee
}

.btn-type--facebook {
    background: #425f9c
}

.btn-type--rss {
    background: #2bb24c
}

.btn:hover {
    background: #000
}

.btn--type--conversion {
    background: #f59701;
    color: #fff;
    font-size: 16px
}

.btn--type--conversion:hover {
    background: #f59701
}

.btn-type--overflow {
    position: relative;
    left: 0;
    right: 0;
    top: -24px;
    z-index: 99;
    margin-bottom: -24px !important
}

.tabledl {
    border-top: 1px dashed #ddd;
    display: table;
    width: 100%;
    font-size: 90%
}

.tabledl-type--col2 .item {
    display: table-cell;
    width: 50%
}

.tabledl__dl {
    display: table;
    border-bottom: 1px dashed #ddd;
    width: 100%
}

.tabledl__dt, .tabledl__dd {
    padding: 20px 10px;
    width: 50%;
    display: table-cell
}

.tabledl__dt {
    font-weight: bold;
    background: #f4f4f4
}

.header {
    padding: 20px 0;
    background: rgba(255, 255, 255, 0.9);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99999;
    backdrop-filter: contrast(4) blur(20px)
}

.worksslide-thumb .slick-track {
    margin: 0 !important;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.worksslide-thumb .slick-track .item {
    width: 126px !important
}

.columnlayout .titlearea {
    margin-bottom: -6px;
    position: relative;
    z-index: 9
}

.columnlayout .titlearea .breadcrumb {
    padding-top: 66px
}

.columnlayout .titlearea .title-type--en {
    font-size: 40px;
    padding-top: 50px
}

.columnlayout__block {
    position: relative
}

.columnlayout__contents {
    width: 72%;
    position: relative
}

.columnlayout__contents .mockup__pc {
    height: 675px
}

.columnlayout__contents .mockup__window {
    top: 0px;
    left: 0px;
    width: 91%;
    height: auto
}

.columnlayout__contents .mockup .worksslide {
    position: absolute !important;
    height: 100% !important;
    top: 8% !important;
    left: 0;
    right: 0
}

.columnlayout__contents .mockup .worksslide .slick-list, .columnlayout__contents .mockup .worksslide .slick-track {
    height: 100% !important
}

.columnlayout__contents .mockup .worksslide__inner {
    overflow-y: scroll !important;
    height: 100% !important;
    top: 0% !important;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.columnlayout__contents .mockup .worksslide__inner::-webkit-scrollbar {
    display: none
}

.columnlayout__contents .mockup .worksslide__inner .mockup__img {
    top: 0 !important;
    height: 100%
}

.columnlayout__sidebar {
    position: absolute;
    top: 100px;
    right: 0;
    width: 25%;
    background: #fff;
    box-shadow: 0 0 10px #ddd;
    z-index: 999
}

.columnlayout__sidebartitle {
    font-size: 26px;
    color: #ddd;
    line-height: 1;
    padding-bottom: 14px
}

.columnlayout__sidebarmenuitem:not(:first-of-type) {
    margin-top: 10px
}

.columnlayout__sidebar .menulist__item:not(:first-child) {
    margin-top: 10px
}

.columnlayout__sidebar .tile {
    padding: 0;
    box-shadow: none
}

.columnlayout__sidebar .tile__img {
    width: 80px;
    height: 80px
}

.columnlayout__sidebar .has-child {
    padding: 10px 20px;
    color: #000;
    text-align: center
}

.columnlayout__sidebar .has-child.active:before {
    display: none !important
}

.columnlayout__sidebar .has-child .child {
    top: 0 !important;
    left: -100% !important;
    z-index: 99
}

.columnlayout__sidebar .btn {
    margin: 0;
    width: 100%
}

.columnlayout__sidebar .box {
    padding: 14px
}

.columnlayout__sidebar .box:not(:last-of-type) {
    border-bottom: 1px solid #ddd
}

.columnlayout__sidebar-type--voice {
    top: 50px
}

.columnlayout-type--leftside .columnlayout__contents {
    margin-left: auto
}

.columnlayout-type--leftside .columnlayout__sidebar {
    margin-left: auto;
    right: auto;
    left: 0
}

.columnlayout-type--leftside .columnlayout__sidebar .has-child .child {
    top: 0 !important;
    left: auto !important;
    right: -100% !important;
    z-index: 99
}

.footnav__title {
    color: #3a3a3a;
    font-weight: bold;
    font-size: 26px
}

.footnavmenu__item {
    font-size: 13px
}

.footnavmenu__item-link {
    color: #999;
    font-weight: normal
}

.copylight {
    display: block;
    text-align: center;
    font-size: 13px;
    margin-top: 50px
}

.globalnav {
    padding-top: 4px
}

.globalnavmenu__item {
    display: inline-block;
    position: relative
}

.globalnavmenu__item:hover {
    cursor: pointer
}

.globalnavmenu__item:not(:last-child):after {
    content: "/";
    display: inline-block;
    padding: 0 0.5em;
    color: #eee
}

.globalnavmenu__item-link-type--conversion {
    color: #f59701
}

.globalnavmenu__item.has-child {
    font-weight: bold
}

.globalnavmenu__item.has-child:after {
    font-weight: normal
}

.globalnavmenu__item.has-child.active:before {
    content: "";
    display: block;
    position: absolute;
    bottom: -34px;
    margin-left: 1.5em;
    z-index: 9;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 8px 0 8px;
    border-color: #ffffff transparent transparent transparent;
    opacity: .9
}

.globalnavmenu__item.has-child .child {
    display: none;
    width: 100vw;
    padding: 50px 0;
    position: fixed;
    left: 0;
    background: rgba(244, 244, 244, 0.9);
    top: 76px
}

.toggle {
    display: none
}

.menu-type--overflow {
    position: relative;
    margin-bottom: -30px;
    z-index: 9
}

.menulist__item.has-child {
    background: #ddd;
    position: relative
}

.menulist__item.has-child:hover {
    cursor: pointer
}

.menulist__item.has-child:after {
    content: "";
    display: block;
    position: absolute;
    top: 48%;
    -webkit-transform: translateY(-48%);
    transform: translateY(-48%);
    right: 6%;
    width: 8px;
    height: 8px;
    background: url(img/arrow.svg) no-repeat center center;
    z-index: 9;
    background-size: contain;
    -moz-transform: rotateZ(90deg);
    -webkit-transform: rotateZ(90deg);
    -o-transform: rotateZ(90deg);
    -ms-transform: rotateZ(90deg)
}

.menulist__item.has-child.active:after {
    content: "";
    display: block;
    position: absolute;
    top: 48%;
    -webkit-transform: translateY(-48%);
    transform: translateY(-48%);
    right: 6%;
    width: 8px;
    height: 8px;
    background: url(img/arrow.svg) no-repeat center center;
    z-index: 9;
    background-size: contain;
    -moz-transform: rotateZ(-90deg);
    -webkit-transform: rotateZ(-90deg);
    -o-transform: rotateZ(-90deg);
    -ms-transform: rotateZ(-90deg)
}

.menulist__item.has-child .child {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    display: none;
    position: absolute;
    width: 100%;
    background: rgba(0, 0, 0, 0.9);
    top: 100%
}

.menulist__item.has-child .child__item {
    width: 100%
}

.menulist__item.has-child .child__item:not(:last-child) {
    border-bottom: 1px solid #555
}

.menulist__item.has-child .child__item-link {
    color: #fff;
    font-weight: normal;
    display: block;
    padding: 16px 0
}

.menulist-type--square {
    list-style-type: none;
    counter-reset: item;
    list-style-type: none;
    padding-left: 0
}

.menulist-type--square .menulist__item:not(:first-child) {
    margin-top: 10px
}

.menulist-type--square .menulist__item:before {
    counter-increment: item;
    content: "0"counter(item) "";
    font-weight: bold;
    font-size: 20px;
    text-align: center;
    color: #fff;
    background: #000;
    display: inline-block;
    width: 36px;
    height: 36px;
    line-height: 36px;
    margin-right: 10px
}

.menulist-type--square .menulist__item-link {
    display: inline-block;
    font-weight: normal
}

.menu-type--panel .menulist {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    box-shadow: 0 0 10px #ddd;
    background: #fff
}

.menu-type--panel .menulist__item {
    width: 50%;
    position: relative
}

.menu-type--panel .menulist__item:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 6%;
    width: 8px;
    height: 8px;
    background: url(img/arrow.svg) no-repeat center center;
    z-index: 9;
    background-size: contain
}

.menu-type--panel .menulist__item:not(:last-child):not(:nth-last-child(2)) {
    border-bottom: 1px solid #ddd
}

.menu-type--panel .menulist__item:nth-child(odd) {
    border-right: 1px solid #ddd
}

.menu-type--panel .menulist__item-link {
    display: block;
    line-height: 60px;
    padding-left: 30px
}

.menu-type--y .menulist {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.menu-type--y .menulist__item {
    flex: 1;
    text-align: center
}

.menu-type--y .menulist__item:not(:first-child) {
    border-left: 2px solid #fff
}

.menu-type--y .menulist__item .btn {
    margin: 0;
    width: 100%;
    padding: 16px 20px
}

.menu-type--y .menulist__item.has-child {
    padding: 16px 0
}

.menu-type--label .menulist__item {
    display: inline-block
}

.menu-type--label .menulist__item:not(:first-child) {
    margin-left: 2px
}

.menu-type--label .menulist__item-link {
    display: inline-block;
    background: #000;
    color: #fff;
    font-size: 14px;
    padding: 2px 20px;
    min-width: 150px;
    text-align: center
}

.numheading {
    font-weight: normal;
    font-size: 60px;
    line-height: .8
}

.numheading__text {
    display: inline-block;
    font-size: 24px;
    position: relative;
    vertical-align: top;
    padding-right: 10px
}

.numheading__text:after {
    content: "";
    display: block;
    position: absolute;
    background: url(img/dot.svg) no-repeat left;
    background-size: contain;
    left: 0;
    bottom: -26px;
    width: 86px;
    height: 13px;
    opacity: .5
}

.glid {
    background: #fff;
    box-shadow: 0 0 10px #ddd;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.glid__img, .glid__text {
    width: 50%
}

.glid__img {
    position: relative
}

.glid__img-type--hearing {
    background: url(img/photo--consultant--big.jpg) no-repeat center center;
    background-size: cover
}

.glid__img-type--areamarketing {
    background: url(img/photo--yokohama--big.jpg) no-repeat center center;
    background-size: cover
}

.glid__img-type--internalseo {
    background: url(img/photo--internalseo--big.jpg) no-repeat center center;
    background-size: cover
}

.glid__img-type--designquality {
    background: url(img/photo--designquality--big.jpg) no-repeat center center;
    background-size: cover
}

.glid__img-type--security {
    background: url(img/photo--security--big.jpg) no-repeat center center;
    background-size: cover
}

.glid__img-type--global {
    background: url(img/photo--global--big.jpg) no-repeat center center;
    background-size: cover
}

.glid__img-type--photo {
    background: url(img/photo--photo--big.jpg) no-repeat center center;
    background-size: cover
}

.glid__img-type--video {
    background: url(img/photo--video--big.jpg) no-repeat center center;
    background-size: cover
}

.glid__img-type--cms {
    background: url(img/photo--cms--big.jpg) no-repeat center center;
    background-size: cover
}

.glid__text {
    padding: 50px
}

.glid__title {
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 20px
}

.glid .numheading {
    display: inline-block;
    text-align: right;
    padding: 20px;
    background: rgba(255, 255, 255, 0.8);
    position: absolute;
    top: 0;
    right: 0
}

.glid .btn {
    width: auto
}

.tile {
    display: table;
    padding: 8px;
    background: #fff;
    box-shadow: 0 0 10px #ddd;
    width: 100%;
    table-layout: fixed
}

.tile:hover {
    background: #fff
}

.tile__img {
    display: table-cell;
    vertical-align: middle;
    width: 60px;
    line-height: 0
}

.tile__img.bg-bk {
    background: #000 !important;
    width: 60px;
    height: 60px;
    position: relative
}

.tile__img.bg-bk img {
    height: 28px;
    width: auto;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 9;
    margin: 0 auto;
    left: 0;
    right: 0
}

.tile__img-type-trianglelabel {
    position: relative;
    color: #fff;
    font-weight: bold
}

.tile__img-type-trianglelabelitem {
    position: absolute;
    top: 0;
    left: 0;
    width: 80px;
    height: 80px;
    overflow: hidden;
    z-index: 1;
    text-align: left;
    padding-top: 20px;
    padding-left: 10px
}

.tile__img-type-trianglelabelitem:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    background: rgba(255, 57, 178, 0.8);
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    z-index: -1;
    top: -50%;
    left: -50%
}

.tile__text {
    display: table-cell;
    vertical-align: middle;
    padding-left: 10px;
    font-size: 12px;
    font-weight: normal
}

.tile__title {
    font-size: 16px;
    line-height: 1.5
}

.tile-type--big {
    display: block;
    text-align: center
}

.tile-type--big .tile__img {
    display: block;
    width: 100%
}

.tile-type--big .tile__img img {
    width: 100%
}

.tile-type--big .tile__text {
    display: block;
    width: 100%;
    font-size: 14px;
    padding: 20px 0 10px
}

.tile-type--big .item__title {
    font-size: 18px;
    margin-bottom: 0
}

.tile-type--big .item__title-type--left {
    text-align: left
}

.date {
    font-size: 14px;
    color: #999;
    text-align: right;
    font-weight: normal
}

.logomask svg {
    width: 80%;
    height: auto;
    margin: 0 auto 100px;
    display: block;
    opacity: .8
}

.sitetitle-link {
    display: table
}

.sitetitle-link * {
    display: table-cell;
    vertical-align: middle
}

.sitetitle__logo {
    height: 40px;
    width: auto;
    margin-top: -8px
}

.sitetitle__name {
    line-height: 1.5;
    font-size: 12px;
    padding: 0px 0 0 10px
}

.section__title {
    font-size: 28px;
    line-height: 1.5;
    margin-bottom: 33.33333px
}

.section__subtitle {
    font-size: 18px;
    display: inline-block;
    vertical-align: middle;
    padding-left: 1em
}

.title-type--none {
    margin-bottom: 0
}

.title-type--en {
    font-size: 60px;
    position: relative;
    margin-bottom: 50px;
    font-weight: bold
}

.title-type--en:after {
    content: "";
    display: block;
    position: relative;
    background: url(img/dot.svg) no-repeat left;
    background-size: contain;
    width: 86px;
    height: 13px;
    opacity: .5;
    margin-top: 33.33333px
}

.title-type--leftdot {
    position: relative;
    padding-left: 30px;
    font-size: 22px;
    line-height: 1.5
}

.title-type--leftdot:before {
    content: "";
    display: block;
    width: 6px;
    height: 48px;
    background: url(img/dot-y.svg) no-repeat left top;
    background-size: cover;
    position: absolute;
    top: -4px;
    left: 0;
    opacity: .5
}

.title-type--border {
    padding-bottom: 25px;
    margin-bottom: 25px;
    position: relative
}

.title-type--border:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: block;
    height: 1px;
    background: linear-gradient(90deg, #ffb901 20.79688%, #fcb803 20.79688%, #02a4ef 41.92188%, #03a4eb 41.92188%, #7fba00 61.67188%, #80b800 61.67188%, #f25022 80.79688%)
}

.title-type--center {
    text-align: center
}

.title-type--center .section__subtitle {
    display: block;
    padding: 0 0 33.33333px
}

.title-type--center:after {
    margin: 0 auto
}

.title-type--gray {
    font-weight: bold;
    opacity: .1;
    font-size: 60px
}

.title-type--graymini {
    font-weight: bold;
    opacity: .2
}

.title-type--manydot {
    position: relative
}

.title-type--manydot .title-type--graymini {
    font-size: 20px;
    padding: 10px 0 0 0
}

.title-type--manydot:before {
    content: "";
    width: 50vw;
    height: 60px;
    display: block;
    position: absolute;
    background: url(img/dot-many.svg) repeat-x right center;
    top: 10px;
    left: -30%;
    opacity: .5
}

.title-type--manydot:after {
    content: "";
    width: 50vw;
    height: 60px;
    display: block;
    position: absolute;
    background: url(img/dot-many.svg) repeat-x left center;
    top: 10px;
    right: -30%;
    opacity: .5
}

.title-type--manydot .section__subtitle {
    padding-bottom: 0
}

.titlearea {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.titlearea .section__title {
    margin-bottom: 0
}

.breadcrumb {
    padding-top: 36px
}

.breadcrumb-list__item {
    display: inline-block;
    position: relative;
    font-size: 14px
}

.breadcrumb-list__item-link {
    font-weight: normal
}

.breadcrumb-list__item:not(:last-child):after {
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3.5px 0 3.5px 4px;
    border-color: transparent transparent transparent #000000;
    margin: 0 0.5em
}

.workstitlearea {
    border-bottom: 2px solid #000;
    position: relative;
    margin-bottom: 50px
}

.workstitlearea .section__title {
    font-size: 32px;
    margin-bottom: 50px
}

.workstitlearea .section__subtitle {
    font-size: 16px;
    display: inline-block;
    vertical-align: middle
}

.sparea {
    position: relative;
    padding-left: 100px;
    padding-top: 50px
}

.sparea .mockup {
    position: absolute;
    display: block;
    width: 222px;
    left: 0;
    top: 50px
}

.sparea__texten {
    font-size: 70px;
    color: #ddd;
    text-align: right;
    line-height: 1;
    font-weight: bold;
    margin-bottom: 10px !important
}

.sparea__text .bg-gray {
    padding: 50px 50px 50px 150px;
    background: #f4f4f4
}

.sparea__title {
    font-size: 22px;
    line-height: 1.5 !important
}

.sparea__description p {
    margin-bottom: 1.5em !important
}

.sparea__description p:last-of-type {
    margin-bottom: 0 !important
}

.kv {
    margin-bottom: 60px;
    background: url(img/seno-kv__bg.jpg) no-repeat center center;
    background-size: cover;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    /* min-height: calc(100vh - 76px); */
    min-height: calc(100vh - 144px);
    position: relative
}

.kv__text {
    width: 100%;
    padding-bottom: 50px
}

.kv__title {
    font-size: 38px;
    font-weight: bold
}

.kv__subtitle {
    font-size: 20px
}

.kv #particles-js {
    position: absolute;
    width: 100%;
    height: 100%
}

@media all and (-ms-high-contrast: none) {
    .kv {
        height: calc(100vh - 76px)
    }
}

.sub-kv {
    background: url(img/photo--venture.jpg) no-repeat center top;
    background-size: cover;
    min-height: 50vh;
    font-weight: bold
}

.sub-kv__item {
    width: 300px;
    height: 300px;
    font-size: 18px;
    text-align: center;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.sub-kv__itemtitle {
    font-size: 40px;
    line-height: 1.5
}

.sub-kv__item-type--white {
    background: rgba(255, 255, 255, 0.8);
    z-index: 2
}

.sub-kv__item-type--black {
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    margin-left: 250px;
    margin-top: -50px;
    z-index: 1
}

.sub-kvchild {
    height: 230px;
    min-height: inherit
}

.sub-kvchild-type--hearing {
    background: url(img/photo--consultant--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--areamarketing {
    background: url(img/photo--yokohama--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--internalseo {
    background: url(img/photo--internalseo--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--designquality {
    background: url(img/photo--designquality--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--security {
    background: url(img/photo--security--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--global {
    background: url(img/photo--global--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--photo {
    background: url(img/photo--photo--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--video {
    background: url(img/photo--video--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--cms {
    background: url(img/photo--cms--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--consulting {
    background: url(img/photo--consultant--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--cording {
    background: url(img/photo--cording--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--direction {
    background: url(img/photo--lady--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--design {
    background: url(img/photo--designquality--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild-type--cms {
    background: url(img/photo--cms--wide.jpg) no-repeat center center;
    background-size: cover
}

.sub-kvchild__title {
    font-size: 28px;
    display: flex;
    justify-content: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.sub-kvchild__title .numheading {
    margin-right: 25px
}

.sub-kvchild-type--voice {
    overflow: hidden
}

.sub-kvchild-type--voice .sub-kvchild__img {
    line-height: 0;
    position: relative;
    height: 100%;
    background: #000
}

.sub-kvchild-type--voice .sub-kvchild__img img {
    width: 100%;
    opacity: .5;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.newsarticle {
    position: absolute;
    display: block;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 9;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding: 8px 0;
    text-align: left
}

.newsarticle .wrapper {
    position: relative
}

.newsarticle__title {
    display: inline-block;
    font-weight: normal;
    position: relative;
    font-size: 16px
}

.newsarticle__title:after {
    content: "/";
    display: inline-block;
    padding: 0 0.5em
}

.newsarticle__more {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    text-align: right
}

.newsarticle__more-link {
    color: #999;
    font-weight: normal;
    text-decoration: underline
}

.newsarticlelist {
    background: #fff;
    box-shadow: 0 0 10px #ddd
}

.newsarticlelist__item {
    position: relative;
    padding: 33.33333px
}

.newsarticlelist__item:not(:last-of-type) {
    border-bottom: 1px solid #ddd
}

.newsarticlelist__item-link {
    display: inline-block;
    color: #137aef
}

.newsarticlelist__date {
    font-weight: bold;
    position: relative
}

.newsarticlelist__date:after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 24px;
    background: #ddd;
    position: relative;
    -ms-transform: rotate(30deg);
    transform: rotate(30deg);
    margin: 0 20px;
    top: 8px
}

.newsarticlelist-type-trianglelabel {
    position: relative;
    color: #fff;
    font-weight: bold
}

.newsarticlelist-type-trianglelabelitem {
    position: absolute;
    top: 0;
    left: 0;
    width: 80px;
    height: 80px;
    overflow: hidden;
    z-index: 1;
    text-align: left;
    padding-top: 6px;
    padding-left: 10px;
    font-weight: bold;
    color: #fff
}

.newsarticlelist-type-trianglelabelitem:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    background: rgba(255, 57, 178, 0.8);
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    z-index: -1;
    top: -50%;
    left: -50%
}

.newslist {
    display: inline-block
}

.newslist__item-link {
    color: #137aef;
    font-size: 15px
}

.entrybody a {
    color: #137aef
}

.entrybody__subtitle {
    display: block;
    font-size: 16px;
    padding-bottom: 6px
}

.entrybody table td {
    border-right: 1px solid #ddd
}

.entrybody table td.bg-gray {
    padding: 10px
}

.entrybody table p {
    margin: 0
}

.entrybody h2 {
    margin-bottom: 33.33333px
}

.entrybody h3 {
    font-size: 25px;
    line-height: 1.5;
    padding-bottom: 33.33333px;
    margin-bottom: 33.33333px;
    position: relative
}

.entrybody h3:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    display: block;
    height: 1px;
    background: linear-gradient(90deg, #ffb901 20.79688%, #fcb803 20.79688%, #02a4ef 41.92188%, #03a4eb 41.92188%, #7fba00 61.67188%, #80b800 61.67188%, #f25022 80.79688%)
}

.entrybody h4 {
    padding-bottom: 33.33333px;
    position: relative;
    padding-left: 30px;
    font-size: 22px;
    line-height: 1.5;
    margin-top: 2em
}

.entrybody h4:before {
    content: "";
    display: block;
    width: 6px;
    height: 48px;
    background: url(img/dot-y.svg) no-repeat left top;
    background-size: cover;
    position: absolute;
    top: -4px;
    left: 0;
    opacity: .5
}

.entrybody p {
    margin-bottom: 2.5em
}

.entrybody ul {
    margin: 0 0 2em 2em;
    list-style-type: disc
}

.entrybody ul li {
    padding-left: 16px;
    position: relative;
    list-style-type: disc
}

.entrybody ol {
    margin: 0 0 2em 3em
}

.entrybody blockquote {
    clear: both;
    margin: 0 0 2em;
    padding: 40px 25px 20px 70px;
    position: relative;
    background: #f8f8f8;
    color: #999;
    font-style: italic
}

.entrybody blockquote:before {
    content: '“';
    font-size: 100px;
    color: #e7e7e7;
    position: absolute;
    top: 00px;
    left: 20px;
    font-style: normal
}

.share {
    width: 100%;
    padding-bottom: 0px
}

.share h4 {
    font-size: 120%;
    text-align: center
}

.sns {
    margin: 0 auto;
    text-align: center
}

.sns ul {
    list-style: none;
    margin: 0 auto
}

.sns li {
    float: left;
    width: 24%
}

.sns li a {
    position: relative;
    display: block;
    color: #fff;
    border-radius: 6px;
    text-align: center;
    text-decoration: none;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
    font-size: 75%;
    padding: 10px 2px
}

.sns li a:hover {
    -webkit-transform: translate3d(0px, 5px, 1px);
    -moz-transform: translate3d(0px, 5px, 1px);
    transform: translate3d(0px, 5px, 1px);
    box-shadow: none
}

.sns .twitter a {
    background: #00acee;
    box-shadow: 0 5px 0 #0092ca
}

.sns .twitter a:hover {
    background: #0092ca
}

.sns .facebook a {
    background: #3b5998;
    box-shadow: 0 5px 0 #2c4373
}

.sns .facebook a:hover {
    background: #2c4373
}

.sns .hatebu a {
    background: #5d8ac1;
    box-shadow: 0 5px 0 #43638b
}

.sns .hatebu a:hover {
    background: #43638b
}

.sns .line a {
    background: #25af00;
    box-shadow: 0 5px 0 #219900
}

.sns .line a:hover {
    background: #219900
}

.sns .pocket a {
    background: #f03e51;
    box-shadow: 0 5px 0 #c0392b
}

.sns .pocket a:hover {
    background: #c0392b
}

.sns .rss a {
    background: #ffb53c;
    box-shadow: 0 5px 0 #e09900
}

.sns .rss a:hover {
    background: #e09900
}

.sns .feedly a {
    background: #87c040;
    box-shadow: 0 5px 0 #74a436
}

.sns .feedly a:hover {
    background: #74a436
}

.frontloading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 9999999999
}

.loading {
    position: relative;
    width: 100px;
    height: 100px
}

.loading::after {
    border-radius: 40%;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, #e8a, rgba(250, 238, 255, 0.3) 90%, rgba(230, 238, 255, 0.5));
    animation: color-fade 3s infinite linear
}

.circle1, .circle2, .circle3 {
    opacity: 0.4;
    position: absolute;
    background: #0af;
    width: 100px;
    height: 100px;
    transform-origin: 50% 47%;
    border-radius: 40%;
    animation: rotation 3s infinite linear
}

.circle2 {
    opacity: 0.2;
    background: #ff0;
    animation: rotation 5s infinite linear
}

.circle3 {
    animation: rotation 2.5s infinite linear
}

.title {
    position: absolute;
    top: 33px;
    width: 100%;
    z-index: 1;
    color: #fff;
    text-align: center;
    font-size: 0.7rem;
    line-height: 2rem;
    letter-spacing: 0.15em;
    animation: text-fade 300ms infinite linear
}

@keyframes rotation {
    from {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes color-fade {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0.7
    }
}

@keyframes text-fade {
    0% {
        opacity: 1
    }

    25% {
        opacity: 0.8
    }

    50% {
        opacity: 0.9
    }

    75% {
        opacity: 0.6
    }
}

.note {
    padding-top: 0
}

.note .box-type--panel {
    box-shadow: 0 0 10px #ddd;
    background: #fff
}

.note .box-type--panel:not(:first-of-type) {
    margin-top: 25px
}

.note .box-type--panel .panel__item-type-service-newcreate {
    background: url(img/photo--meeting-inhouse.jpg) no-repeat center center;
    background-size: cover
}

.note .box-type--panel .panel__item-type-service-renewal {
    background: url(img/photo--meeting-client.jpg) no-repeat center center;
    background-size: cover
}

.note .box-type--panel .panel__item-type-service-consulting {
    background: url(img/photo--consultant.jpg) no-repeat center center;
    background-size: cover
}

.note .box-type--panel .panel__item-type-service-seo {
    background: url(img/photo--oficelady.jpg) no-repeat center center;
    background-size: cover
}

.note .box-type--panel .panel__item-type-service-meo {
    background: url(img/photo--lady--outside.jpg) no-repeat center center;
    background-size: cover
}

.note .box-type--panel .panel__item-type-service-contentsmarketing {
    background: url(img/photo--contentsmarketing.jpg) no-repeat center center;
    background-size: cover
}

.note .box-type--panel .panel__item-type-service-agency {
    background: url(img/photo--lady--smile.jpg) no-repeat center center;
    background-size: cover
}

.note .box-type--panel .panel__item-type-service-ad {
    background: url(img/photo--agency.jpg) no-repeat center center;
    background-size: cover
}

.note .header {
    background: none;
    position: absolute;
    backdrop-filter: none
}

.note .columnlayout__block {
    min-height: 1000px
}

.note .columnlayout__sidebar {
    top: 0;
    box-shadow: none;
    background: #f4f4f4
}

.note .columnlayout__sidebar .tile {
    background: none
}

.note .columnlayout__sidebar .tile__title {
    font-size: 14px
}

.note .notemenu {
    margin-bottom: 100px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.note .notemenu .menulist__item-link {
    display: block;
    text-align: center;
    padding: 30px 0;
    color: #777;
    -webkit-transition-property: padding;
    -webkit-transition-duration: .5s
}

.note .notemenu-type--fixed {
    background: rgba(244, 244, 244, 0.9);
    width: 100%;
    left: 0;
    position: fixed;
    top: 0;
    z-index: 999999
}

.note .notemenu-type--fixed .menulist__item-link {
    padding: 16px 0
}

.note .globalnavmenu__item.has-child.active:before {
    display: none
}

.note .globalnavmenu__item.has-child .child {
    background: none
}

.note .globalnavmenu__item-link-type--conversion {
    color: #000
}

.note #searchform {
    position: relative
}

.note #searchform input[type='text'] {
    background: #fff;
    border: 1px solid #ddd
}

.note #searchsubmit {
    border: none;
    background: none;
    width: 46px;
    height: 46px;
    cursor: pointer;
    position: absolute;
    top: 0px;
    right: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.note #searchsubmit:hover {
    opacity: .8
}

.note #searchsubmit svg {
    width: 50%;
    height: auto;
    margin: 0 auto
}

.note .tile {
    padding: 0px
}

.note .tile-type--big .tile__text {
    padding: 20px
}

.note .article__header {
    margin-bottom: 40px
}

.note .article__title {
    font-size: 34px;
    margin-bottom: 40px
}

.note .article .articleinfo .author__img {
    position: relative;
    bottom: auto;
    left: 10px
}

.note .article .articleinfo .author__name {
    padding-left: 20px;
    font-size: 16px
}

.note .article .articleinfo .date {
    font-size: 16px;
    vertical-align: middle;
    padding-left: 20px
}

.note .article .articleinfo .label {
    height: 100%;
    font-size: 16px;
    padding: 6px 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.note .article__img {
    margin-bottom: 50px
}

.note .article__img img {
    width: 100%;
    height: auto
}

.note .article__footer {
    margin-bottom: 50px
}

.note .article__footer .authorarea .item__text {
    padding: 0
}

.note .article__footer .authorarea__title {
    font-size: 26px;
    margin-bottom: 16px
}

.note .article__footer .authorarea__job {
    font-size: 16px;
    display: inline-block;
    vertical-align: middle;
    padding-left: 10px
}

.note .article__footer .authorarea .btn {
    width: 100%
}

.note .article__footer .authorarea .box {
    padding: 30px
}

.note .articleinfo {
    position: relative;
    line-height: 29px;
    text-align: left
}

.note .articleinfo__item {
    display: inline-block;
    font-weight: normal;
    font-size: 12px
}

.note .articleinfo .label {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0 6px;
    width: auto
}

.note .articleinfo .date {
    padding-left: 8px
}

.note .articleinfo .author__img {
    position: absolute;
    bottom: 0;
    left: 10px
}

.note .articleinfo .author__name {
    padding-left: 74px;
    font-size: 12px
}

.note .articlelist {
    position: relative
}

.note .articlelist:first-of-type:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: block;
    height: 1px;
    background: linear-gradient(90deg, #ffb901 20.79688%, #fcb803 20.79688%, #02a4ef 41.92188%, #03a4eb 41.92188%, #7fba00 61.67188%, #80b800 61.67188%, #f25022 80.79688%)
}

.note .articlelist:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: block;
    height: 1px;
    background: linear-gradient(90deg, #ffb901 20.79688%, #fcb803 20.79688%, #02a4ef 41.92188%, #03a4eb 41.92188%, #7fba00 61.67188%, #80b800 61.67188%, #f25022 80.79688%)
}

.note .articlelist-link {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 40px 0
}

.note .articlelist__img {
    width: 40%
}

.note .articlelist__text {
    width: 56%
}

.note .articlelist__title {
    font-size: 22px;
    line-height: 1.5;
    padding: 30px 0
}

.note .articlelist__footer {
    display: table;
    width: 100%
}

.note .articlelist__footer .author, .note .articlelist__footer .date {
    display: table-cell
}

.note .label-type--black {
    background: #000;
    color: #fff;
    padding: 4px 0;
    width: 140px;
    text-align: center;
    font-size: 12px
}

.note .author__img {
    width: 60px;
    height: 60px;
    border-radius: 500px;
    -webkit-border-radius: 500px;
    -moz-border-radius: 500px;
    border: 4px solid #fff;
    overflow: hidden;
    box-shadow: 0 0 10px #ddd;
    display: inline-block;
    vertical-align: middle
}

.note .author__name {
    font-size: 14px;
    font-weight: bold;
    display: inline-block;
    vertical-align: middle
}

.note .breadcrumb {
    padding-bottom: 36px
}

.note .kv {
    min-height: 40vh;
    background: url(img/senotekv__bg.jpg) no-repeat center bottom;
    background-size: cover
}

.note .kv:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url(img/dot.png);
    opacity: .5
}

.note .kv__title {
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    margin-bottom: -50px
}

.note .kv__title-link {
    color: #fff
}

.note .kv__title img {
    display: block;
    margin: 0 auto 20px;
    width: 100%;
    height: auto
}

.note .kv-type--notechild {
    min-height: inherit;
    height: auto
}

.note .entrybody {
    padding-bottom: 50px;
    word-break: break-all
}

.note .entrybody h2 {
    font-size: 26px;
    margin-top: 3em;
    text-shadow: 0 3px 0 #fff, 3px 0 0 #fff, 0 -3px 0 #fff, -3px 0 0 #fff, -3px -3px 0 #fff, 3px -3px 0 #fff, -3px 3px 0 #fff, 3px 3px 0 #fff;
    padding: 25px;
    position: relative;
    z-index: 2
}

.note .entrybody h2:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: url(img/bg-dot.svg) repeat-y left top;
    background-size: contain;
    z-index: -1;
    opacity: .5
}

.note .entrybody ol {
    margin: 0 0 2em 3em
}

.note .entrybody ol li {
    list-style-type: inherit
}

.note .entrybody ol li:before {
    display: none
}

.note .entrybody #toc_container ul.toc_list ul {
    margin-left: 1em
}

@media screen and (max-width: 1200px) {
    .tile-type--big .item__title {
        font-size: 16px;
        margin-bottom: 0
    }

    .frontworks__inner .mockup {
        width: 60%
    }

    .frontworks__inner .mockup__pc {
        position: relative;
        height: auto
    }

    .frontworks__inner .mockup__pc:before {
        content: "";
        display: block;
        padding-top: 86%
    }

    .frontworks .col2 {
        width: 38%
    }

    .frontworksmenu {
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        height: 48px
    }

    .frontworksmenu .btn {
        min-width: inherit
    }

    .frontworksmenu__item:last-child {
        padding-right: 10px
    }
}

@media screen and (max-width: 960px) {
    html {
        overflow-x: hidden
    }

    body {
        padding-top: 56px;
        padding-bottom: 50px;
        font-size: 14px;
        -webkit-text-size-adjust: 100%
    }

    .pc-hyde {
        display: block
    }

    .sp-hyde {
        display: none
    }

    .flexbox.col2-type--sprighttup {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
    }

    .flexbox.col2-type--sprighttup .item:nth-of-type(2) {
        margin-top: 0
    }

    .flexbox.col2>.item {
        width: 100%;
        margin-top: 4vw
    }

    .flexbox.col2>.item.col2 {
        margin-top: 0
    }

    .flexbox.col3>.item {
        width: 100%;
        margin-top: 4vw
    }

    .flexbox.col3>.item:nth-of-type(n+4) {
        margin-top: 4vw
    }

    .flexbox.start.col3>.item {
        width: 100%;
        margin-right: 0%;
        margin-left: 0%
    }

    .flexbox.col4>.item {
        width: 100%;
        margin-top: 4vw
    }

    .flexbox.spcol2 {
        -webkit-justify-content: space-between;
        justify-content: space-between;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .flexbox.spcol2 .item {
        width: 48.5% !important
    }

    .flexbox.spcol2 .item .squarethumb__title {
        font-size: 16px
    }

    .flexbox.spcol2 .item .squarethumb__subtitle {
        font-size: 12px
    }

    .top50 {
        margin-top: 8vw
    }

    .bottom60, .bottom50, .bottom80 {
        margin-bottom: 8vw
    }

    .bottom40, .bottom30 {
        margin-bottom: 4vw
    }

    .btn {
        width: 100%;
        margin-top: 4vw
    }

    .btn-type--overflow {
        position: relative;
        bottom: auto;
        top: auto;
        margin-bottom: 0 !important
    }

    .mustcenter {
        margin: 4vw auto 0 !important
    }

    .sitetitle__logo {
        height: 30px;
        width: auto;
        margin-top: 0
    }

    .sitetitle__name {
        font-size: 11px;
        padding-top: 2px
    }

    .header {
        padding: 10px 0 12px;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .header.open {
        min-height: 100vh;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        z-index: 999999
    }

    .header.open .square {
        background: none
    }

    .header.open .square .menu-trigger span {
        background-color: #000
    }

    .header.open .square .menu-trigger::before {
        color: #000
    }

    .header .flexbox {
        display: block;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .header .wrapper {
        width: 92vw
    }

    .header.onscroll .square {
        height: 100%
    }

    .header.onscroll .square #toggle {
        padding-top: 6px
    }

    .header.open.onscroll .square {
        height: auto
    }

    .square {
        position: absolute;
        width: 84px;
        height: 44px;
        right: 0;
        top: 0;
        background: #000;
        z-index: 9999999;
        transition: all .4s
    }

    #toggle {
        position: absolute;
        width: 20px !important;
        top: -2px;
        right: 12px;
        display: block;
        height: 30px;
        transition: all .4s
    }

    .menu-trigger, .menu-trigger span {
        display: block;
        transition: all .4s;
        box-sizing: border-box
    }

    .menu-trigger {
        position: relative;
        width: 100%;
        height: 100%
    }

    .menu-trigger span {
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: #fff;
        border-radius: 2px
    }

    .menu-trigger span:nth-of-type(1) {
        top: 16px
    }

    .menu-trigger span:nth-of-type(2) {
        top: 22px
    }

    .menu-trigger span:nth-of-type(3) {
        top: 28px
    }

    .menu-trigger::before {
        position: absolute;
        left: -40px;
        bottom: auto;
        top: 16px;
        content: 'MENU';
        display: block;
        width: 100%;
        color: #fff;
        font-size: 10px;
        text-decoration: none;
        text-align: center;
        transition: all .4s
    }

    .menu-trigger.active span:nth-of-type(1) {
        -webkit-transform: translateY(6px) rotate(-45deg);
        transform: translateY(6px) rotate(-45deg)
    }

    .menu-trigger.active span:nth-of-type(2) {
        opacity: 0
    }

    .menu-trigger.active span:nth-of-type(3) {
        -webkit-transform: translateY(-6px) rotate(45deg);
        transform: translateY(-6px) rotate(45deg)
    }

    .box {
        padding: 8vw
    }

    .box .section__title {
        font-size: 18px
    }

    .box-type--panel {
        padding: 0;
        display: block;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .box-type--panel .panel__item {
        width: 100%;
        padding: 8vw
    }

    .box-type--panel .panel__item .mockup__pc {
        height: auto !important;
        margin-top: 4vw
    }

    .box-type--panel .panel__item .mockup__pc:before {
        content: "";
        display: block;
        padding-top: 86%
    }

    .box-type--panel .panel__item .mockup__window {
        width: 91%;
        height: auto;
        left: 0;
        right: 0;
        margin: 0 auto;
        top: 0;
        overflow: visible
    }

    .box-type--panel .panel__item .mockup__img {
        overflow: hidden
    }

    .box-type--thumb .item__text {
        padding-top: 0
    }

    .box-type--thumb .item .squarethumb-type--mini {
        width: 16vw;
        height: 16vw;
        border: solid 4px #fff
    }

    .box-type--formarea {
        padding: 4vw 4vw 8vw
    }

    .box-type--formarea .red {
        font-size: 12px
    }

    .box-type--faq {
        padding: 4vw
    }

    .box-type--faq:not(:first-of-type) {
        margin-top: 8vw
    }

    .box-type--faq .section__title {
        font-size: 18px
    }

    .box-type--faq .box {
        padding: 4vw
    }

    .columnlayout .titlearea .title-type--en {
        padding: 8vw 0 0 0;
        font-size: 26px
    }

    .columnlayout .titlearea .breadcrumb {
        padding: 4vw 0 8vw
    }

    .columnlayout__contents {
        position: relative;
        width: 100%
    }

    .columnlayout__contents .mockup__pc {
        height: auto
    }

    .columnlayout__contents .mockup__pc:before {
        content: "";
        display: block;
        padding-top: 86%
    }

    .columnlayout__sidebar {
        position: relative;
        width: 100%;
        top: 0;
        margin-bottom: 8vw
    }

    .columnlayout__sidebar .has-child .child {
        top: 100% !important;
        left: 0 !important;
        right: 0 !important
    }

    .columnlayout-type--leftside .columnlayout__sidebar .has-child .child {
        top: 100% !important;
        left: 0 !important;
        right: 0 !important
    }

    .container {
        padding: 8vw 0
    }

    .container-type--bgleftgray .wrapper {
        padding: 8vw 0
    }

    .container-type--bgleftgray .wrapper:before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        background: #f4f4f4;
        width: 100vw;
        left: 50%;
        transform: translateX(-50%);
        height: 100%;
        z-index: -1;
        margin-right: 20%
    }

    .container-type--bgleftgray .wrapper .section__title.title-type--center {
        margin-bottom: 0;
        font-size: 18px
    }

    .container-type--bgrightgray .wrapper {
        padding: 8vw 0
    }

    .container-type--bgrightgray .wrapper .section__title.title-type--center {
        margin-bottom: 0;
        font-size: 18px
    }

    .container-type--bgrightgray .wrapper table th {
        width: auto
    }

    .container-type--mini .title-type--en {
        font-size: 26px;
        margin-bottom: 4vw
    }

    .container-type--mini .title-type--en .section__subtitle {
        font-size: 14px
    }

    .container-type--mini .title-type--en:before {
        display: none
    }

    .container-type--mini .title-type--en:after {
        content: "";
        display: block;
        position: relative;
        background: url(img/dot.svg) no-repeat left;
        background-size: contain;
        width: 50px;
        height: 13px;
        opacity: .5;
        margin-top: 2vw
    }

    .container-type--tiles .section__title {
        font-size: 26px
    }

    .container-type--tiles .section__title:after {
        content: "";
        display: block;
        position: relative;
        background: url(img/dot.svg) no-repeat left;
        background-size: contain;
        width: 50px;
        height: 13px;
        opacity: .5;
        margin-top: 2vw
    }

    .container-type--tiles .oursns {
        position: absolute;
        right: 8vw;
        padding-top: 1.6vw
    }

    .container-type--tiles .oursns .ico-fa {
        font-size: 30px
    }

    .container-type--tiles .item__title img {
        display: none
    }

    .container-type--footnav {
        padding: 4vw
    }

    .container-type--footnav .flexbox.col5 {
        display: none
    }

    .container-type--footnav small {
        margin: 0
    }

    .sub-container {
        padding-bottom: 4vw
    }

    .sub-container-type--step .step__title {
        font-size: 18px
    }

    .sub-container-type--step .step__title-squareheading {
        margin-right: 2vw
    }

    .wrapper {
        width: 88vw;
        margin: 0 auto
    }

    .globalnavmenu__item {
        display: block;
        border-bottom: 1px solid #eee
    }

    .globalnavmenu__item:not(:last-child):after {
        display: none
    }

    .globalnavmenu__item-link {
        display: block;
        line-height: 50px
    }

    .globalnavmenu__item.has-child {
        display: block;
        line-height: 50px
    }

    .globalnavmenu__item.has-child:after {
        content: "+";
        display: block;
        font-size: 20px;
        color: #000;
        position: absolute;
        right: 0;
        top: 0px
    }

    .globalnavmenu__item.has-child.active:before {
        display: none
    }

    .globalnavmenu__item.has-child.active:after {
        content: "-"
    }

    .globalnavmenu__item.has-child .child {
        position: relative;
        top: auto;
        width: 100%;
        padding: 4vw
    }

    .globalnavmenu__item.has-child .child .wrapper {
        width: 100%
    }

    .globalnavmenu__item.has-child .child .flexbox.col2>.item:first-of-type {
        margin-top: 0
    }

    .globalnavmenu__item.has-child .tile .item__title {
        font-size: 14px
    }

    .globalnavmenu__item.has-child .tile__img {
        display: none
    }

    .globalnavmenu__item.has-child .tile__text {
        padding: 0;
        line-height: 50px
    }

    .menu-type--label {
        -webkit-justify-content: space-between;
        justify-content: space-between;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .menu-type--label .menulist__item {
        width: 48.5%;
        margin: 2vw 0 0
    }

    .menu-type--label .menulist__item-link {
        width: 100%;
        padding: 6px 0;
        font-size: 12px;
        min-width: inherit
    }

    .menu-type--label .menulist__item:not(:first-child) {
        margin: 2vw 0 0
    }

    .menu-type--panel .menulist__item:after {
        display: none
    }

    .menu-type--panel .menulist__item-link {
        line-height: 1;
        display: block;
        padding: 16px 0;
        text-align: center;
        font-size: 13px
    }

    .menu-type--global {
        display: none
    }

    .menu-type--overflow {
        margin-bottom: 0px
    }

    .menu-type--y {
        font-size: 12px
    }

    .menu-type--y .menulist__item {
        width: 25%
    }

    .menu-type--y .menulist__item:nth-child(2) .child {
        left: -100%;
        margin-left: -2px !important
    }

    .menu-type--y .menulist__item:nth-child(3) .child {
        left: -200%;
        margin-left: -4px !important
    }

    .menu-type--y .menulist__item:nth-child(4) .child {
        left: -300%;
        margin-left: -6px !important
    }

    .menu-type--y .menulist__item.has-child {
        padding: 12px 0
    }

    .menu-type--y .menulist__item.has-child.active {
        background: #000;
        color: #fff
    }

    .menu-type--y .menulist__item.has-child.active:before {
        display: none
    }

    .menu-type--y .menulist__item.has-child:after {
        display: none
    }

    .menu-type--y .menulist__item.has-child .child {
        position: absolute;
        width: 88vw;
        margin: 0 auto
    }

    .menu-type--y .menulist__item .btn {
        min-width: inherit;
        padding: 12px 0
    }

    .kv {
        background: none;
        text-align: left;
        display: block;
        justify-content: none;
        align-items: none;
        min-height: 72vh;
        position: relative;
        border-right: solid 12px #fff;
        border-bottom: solid 12px #fff;
        border-left: solid 12px #fff;
        position: relative;
        z-index: 3
    }

    .kv:before {
        content: "";
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        background: url(img/seno-kv__bg--sp02.jpg) no-repeat center right;
        background-size: cover;
        animation: bgAnime02 20s infinite;
        animation-delay: 6s;
        z-index: -2;
        opacity: 0
    }

    .kv:after {
        content: "";
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        background: url(img/seno-kv__bg--sp01.jpg) no-repeat center center;
        background-size: cover;
        animation: bgAnime01 20s infinite;
        animation-delay: 6s;
        z-index: -1
    }

    @keyframes bgAnime01 {
        0% {
            opacity: 1
        }

        25% {
            opacity: 1
        }

        50% {
            opacity: 0
        }

        75% {
            opacity: 0
        }

        100% {
            opacity: 1
        }
    }

    @keyframes bgAnime02 {
        0% {
            opacity: 0
        }

        25% {
            opacity: 0
        }

        50% {
            opacity: 1
        }

        75% {
            opacity: 1
        }

        100% {
            opacity: 0
        }
    }

    .kv__text {
        padding: 12px 12px 0 0;
        background: #fff;
        position: absolute;
        bottom: 0;
        left: 0;
        width: auto
    }

    .kv__title {
        font-size: 22px;
        line-height: 1.5;
        padding-bottom: 10px
    }

    .kv__subtitle {
        font-size: 14px;
        line-height: 1.5
    }

    .iframe iframe {
        width: 100%;
        height: auto
    }

    .sub-kv__item {
        width: 50vw;
        height: 50vw;
        font-size: 14px
    }

    .sub-kv__itemtitle {
        font-size: 24px
    }

    .sub-kv__item.sub-kv__item-type--black {
        margin-left: 38vw;
        margin-top: -6vw;
        z-index: 1
    }

    .sub-kvchild-type--voice {
        height: auto
    }

    .sub-kvchild-type--voice .sub-kvchild__img img {
        position: relative;
        top: 0;
        -webkit-transform: none;
        transform: none
    }

    .sub-kvchild__title {
        font-size: 22px;
        display: block;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .sub-kvchild__title .numheading {
        margin: 0 0 4vw;
        display: block
    }

    .glid {
        display: block;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .glid__img {
        width: 100%;
        height: 40vw
    }

    .glid__text {
        width: 100%;
        padding: 8vw
    }

    .glid__title {
        font-size: 22px
    }

    .numheading {
        font-size: 40px
    }

    .numheading__text {
        font-size: 18px
    }

    .numheading__text:after {
        content: "";
        display: block;
        position: absolute;
        background: url(img/dot.svg) no-repeat left;
        background-size: contain;
        width: 50px;
        height: 13px;
        opacity: .5
    }

    .newsarticle {
        bottom: -54px;
        height: 40px;
        width: 100vw;
        left: 50%;
        transform: translateX(-50%)
    }

    .newsarticle__title {
        display: inline
    }

    .newsarticle__more {
        display: none
    }

    .newsarticlelist__item {
        padding: 4vw
    }

    .newsarticlelist-type-trianglelabelitem {
        position: absolute;
        top: 0;
        left: 0;
        width: 50px;
        height: 50px;
        overflow: hidden;
        z-index: 1;
        text-align: left;
        padding-top: 0px;
        padding-left: 4px;
        font-weight: bold;
        color: #fff
    }

    .newslist {
        width: calc(100% - 5em);
        overflow-x: scroll;
        -webkit-overflow-scrolling-x: touch;
        display: block;
        height: 28px;
        position: absolute;
        top: 0;
        left: 5em;
        white-space: nowrap
    }

    .newslist__item {
        display: inline-block
    }

    .frontworks {
        padding: 0
    }

    .frontworks .bg-gray {
        padding: 8vw 0
    }

    .frontworks .bg-gray:after {
        width: 100vw;
        left: 50%;
        transform: translateX(-50%)
    }

    .frontworks .bg-gray .col2 {
        width: 100%
    }

    .frontworks .bg-gray .col2 .item {
        width: 48.5%
    }

    .frontworks .bg-gray .col2 .item .squarethumb__subtitle {
        font-size: 12px
    }

    .frontworksmenu {
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        height: 45px
    }

    .frontworksmenu .btn {
        min-width: inherit
    }

    .frontworksmenu__item:last-child {
        padding-right: 10px
    }

    .frontworks__nav {
        width: 100vw;
        left: 50%;
        transform: translateX(-50%);
        position: relative
    }

    .frontworks__inner .mockup {
        width: 100%
    }

    .frontworks__inner .mockup__pc {
        position: relative;
        height: auto
    }

    .frontworks__inner .mockup__pc:before {
        content: "";
        display: block;
        padding-top: 86%
    }

    .frontstrength {
        /* padding-top: 100px; */
        padding-top:60px;
    }

    .frontstrength:after {
        bottom: auto;
        top: 36%;
        z-index: 99;
        width: 60vw;
        height: 40vw
    }

    .frontstrengthslide {
        width: 100%;
        position: relative !important;
        bottom: auto;
        overflow-x: hidden
    }

    .frontstrengthslide .frontstrengthslide__item .frontstrengthslide__title {
        font-size: 18px
    }

    .frontstrengthslide__img img {
        width: 100%
    }

    .frontstrength__logo {
        text-align: left;
        top: -50px;
        left: -5%
    }

    .frontstrength__logo img {
        height: 70px;
        width: auto;
        right: auto;
        margin-left: 0
    }

    .frontstrength .flexbox.col2 {
        display: block;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .frontstrength .flexbox.col2 .item {
        width: 100%
    }

    .frontstrength .flexbox.col2 .item__text {
        padding: 6vw 0
    }

    .frontstrength .flexbox.col2 .section__title br {
        display: none
    }

    .frontstrength .flexbox.col2 .img-type--right0 img {
        position: relative;
        width: 100vw;
        left: 50%;
        transform: translateX(-50%)
    }

    .frontstrength .bg-gray {
        padding: 0 0 8vw
    }

    .frontstrength .bg-gray:before {
        content: "";
        width: 100vw;
        left: 50%;
        transform: translateX(-50%)
    }

    .frontnote .col4 .item {
        width: 49%
    }

    .frontnote .col4 .item:nth-of-type(n+3) {
        margin-top: 2vw
    }

    .frontnote .col4 .item .tile {
        text-align: center
    }

    .frontnote .col4 .item .tile__text {
        padding: 6px 0
    }

    .frontnote .col4 .item .tile__img {
        display: none
    }

    .frontnote .col4 .item .tile__title {
        font-size: 12px
    }

    .frontvoice {
        padding-bottom: 0
    }

    .frontvoice .section__title {
        text-align: left;
        margin-left: 8vw
    }

    .frontvoice .section__title .section__subtitle {
        display: inline-block;
        padding-left: 1em;
        padding-bottom: 0
    }

    .frontvoice .section__title:after {
        margin: 2vw auto auto 0
    }

    .frontvoice .slidearea {
        display: none
    }

    .frontvoice .slidethumb {
        margin-top: 0
    }

    .frontvoice .slidethumb__item {
        width: 80vw !important
    }

    .frontvoice .slidethumb__item img {
        width: 100%;
        height: auto
    }

    .frontvoice .bg-gray {
        padding: 8vw 0
    }

    .frontvoice .btn {
        position: relative;
        bottom: auto
    }

    .frontguide .wrapper>.col2>.item {
        width: 100%
    }

    .frontguide .wrapper>.col2>.item:first-of-type:after {
        display: none
    }

    .frontguide .section__title {
        margin-bottom: 4vw;
        text-align: center;
        line-height: 1.5
    }

    .frontguide .section__title:after {
        content: "";
        display: block;
        position: relative;
        background: url(img/dot.svg) no-repeat left;
        background-size: contain;
        width: 50px;
        height: 13px;
        opacity: .5;
        margin: 2vw auto 0
    }

    .frontguide .section__subtitle {
        display: block
    }

    .workstitlearea {
        border-bottom: 0;
        margin-bottom: 8vw
    }

    .workstitlearea .section__title {
        font-size: 22px;
        margin-bottom: 4vw
    }

    .workstitlearea .section__title .section__subtitle {
        display: block;
        font-size: 14px;
        padding-left: 0
    }

    .section__title {
        font-size: 22px;
        margin-bottom: 4vw
    }

    .tile {
        width: 100%
    }

    .tile__img {
        width: 20%
    }

    .title-type--leftdot {
        margin: 1.5em 0 1em
    }

    .title-type--none {
        margin-bottom: 0
    }

    .title-type--en {
        font-size: 26px
    }

    .title-type--en:after {
        width: 50px;
        height: 13px;
        margin-top: 2vw
    }

    .title-type--en .section__subtitle {
        font-size: 14px
    }

    .title-type--manydot {
        width: 100%;
        padding: 0 22vw
    }

    .title-type--manydot:after {
        content: "";
        width: 50vw;
        height: 60px;
        display: block;
        position: absolute;
        background: url(img/dot-many.svg) repeat-x left center;
        top: 00px;
        right: -30%;
        opacity: .5
    }

    .title-type--manydot.title-type--spsmall {
        font-size: 17px;
        margin-bottom: 0
    }

    .title-type--manydot.title-type--spsmall br {
        display: none
    }

    .title-type--manydot.title-type--spsmall .section__subtitle {
        display: none
    }

    .title-type--center .section__subtitle {
        padding-bottom: 2vw
    }

    .title-type--gray {
        font-size: 26px;
        line-height: 1.5
    }

    .mockup__title {
        font-size: 22px
    }

    .mockup__pc-type-circlelabelitem {
        color: #fff;
        font-size: 16px;
        font-weight: bold;
        position: absolute;
        width: 60px;
        height: 60px;
        display: flex;
        justify-content: center;
        align-items: center;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        border-radius: 500px;
        -webkit-border-radius: 500px;
        -moz-border-radius: 500px;
        background: rgba(255, 57, 178, 0.8);
        z-index: 9;
        top: -16px;
        left: -16px;
        border: 5px solid #ff9fd9;
        animation-duration: 1.5s;
        animation-iteration-count: infinite
    }

    .spfootnav {
        -webkit-justify-content: space-between;
        justify-content: space-between;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        z-index: 99999;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .spfootnav__item {
        width: 50%
    }

    .spfootnav__item-link {
        font-size: 16px;
        display: block;
        line-height: 50px;
        text-align: center;
        background: rgba(0, 0, 0, 0.8);
        color: #fff;
        font-weight: bold
    }

    .spfootnav__item-link-type--conversion {
        background: rgba(245, 151, 1, 0.8);
        color: #000
    }

    .breadcrumb {
        padding-top: 4vw
    }

    .breadcrumb-list__item {
        font-size: 12px
    }

    .titlearea {
        display: block;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .title-type--spsmall {
        font-size: 18px
    }

    .logomask svg {
        margin-bottom: 8vw
    }

    .text-center-type--left {
        text-align: left
    }

    table th {
        width: 30%
    }

    .squarethumb-type--mini {
        width: 30vw;
        height: 30vw
    }

    .squarethumb-type--mini.squarethumb-type--overflow {
        display: none
    }

    .tabledl {
        margin-bottom: 4vw
    }

    .tabledl-type--col2 {
        display: block
    }

    .tabledl-type--col2 .item {
        display: block;
        width: 100%
    }

    .sparea {
        padding: 0
    }

    .sparea .bg-gray {
        padding: 8vw
    }

    .sparea .mockup {
        position: relative;
        right: 0;
        margin: 0 auto;
        top: 0;
        margin-bottom: 4vw
    }

    .sparea__texten {
        font-size: 40px;
        text-align: center;
        margin-bottom: 4vw !important
    }

    .entrybody h3 {
        font-size: 18px;
        padding-bottom: 4vw;
        margin-bottom: 1em
    }

    .entrybody h4 {
        font-size: 18px;
        padding-bottom: 4vw
    }

    .entrybody h4:before {
        top: -8px
    }

    .worksslide-thumb .slick-track {
        width: 100% !important;
        transform: translate3d(0px, 0px, 0px) !important
    }

    .worksslide-thumb .slick-track .item {
        width: 18% !important
    }
}

@media screen and (max-width: 960px) {
    .note {
        padding-bottom: 0
    }

    .note .spcol2 .item__title {
        font-size: 14px
    }

    .note .tile-type--big .tile__text {
        padding: 4vw
    }

    .note .header {
        background: rgba(255, 255, 255, 0.9)
    }

    .note .header .tile {
        padding: 8px
    }

    .note .kv {
        border: none;
        padding: 80px 0 24px
    }

    .note .kv-type--notechild {
        padding: 60px 0 24px
    }

    .note .kv-type--notechild .kv__title img {
        height: 40px;
        width: auto
    }

    .note .kv:before, .note .kv:after {
        display: none
    }

    .note .kv__title {
        text-align: center;
        font-size: 14px
    }

    .note .kv__title img {
        height: 60px;
        width: auto
    }

    .note .notemenu {
        margin-bottom: 4vw
    }

    .note .notemenu .wrapper {
        width: 100%
    }

    .note .notemenu .menulist__item-link {
        font-size: 12px;
        padding: 10px 0
    }

    .note .globalnavmenu__item-link-type--conversion {
        color: #f59701
    }

    .note .articlelist-link {
        display: block;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 4vw 0
    }

    .note .articlelist__title {
        padding: 2vw 0;
        font-size: 18px
    }

    .note .articlelist__img {
        width: 100%
    }

    .note .articlelist__img img {
        width: 100%;
        height: auto
    }

    .note .articlelist__text {
        width: 100%
    }

    .note .article__header {
        padding: 4vw 0;
        margin-bottom: 0
    }

    .note .article__img {
        margin-bottom: 4vw
    }

    .note .article__title {
        font-size: 24px;
        margin-bottom: 4vw;
        line-height: 1.5
    }

    .note .article .articleinfo {
        padding: 2vw
    }

    .note .article .articleinfo .author {
        display: none
    }

    .note .article .articleinfo .label {
        font-size: 12px
    }

    .note .article .articleinfo .date {
        padding-left: 0;
        font-size: 12px;
        display: block;
        text-align: left;
        line-height: 1.5
    }

    .note .article__footer .authorarea .box-type--thumb {
        display: block;
        padding: 6vw
    }

    .note .article__footer .authorarea .box-type--thumb .item {
        display: block
    }

    .note .article__footer .authorarea .box-type--thumb .squarethumb {
        position: absolute
    }

    .note .article__footer .authorarea .box-type--thumb .squarethumb.item .squarethumb-type--mini {
        width: 22vw;
        height: 22vw
    }

    .note .article__footer .authorarea__title {
        padding-top: 2vw;
        padding-left: 24vw;
        font-size: 18px;
        margin-bottom: 6vw
    }

    .note .article__footer .authorarea__job {
        display: block;
        font-size: 14px;
        padding-left: 0
    }

    .note .article__footer .authorarea .btn {
        margin-top: 0
    }

    .note .columnlayout__block {
        min-height: inherit
    }

    .note .columnlayout__sidebar {
        margin-top: 8vw
    }

    .note .breadcrumb {
        padding-bottom: 4vw
    }

    .note .entrybody p {
        font-size: 15px
    }

    .note .entrybody h2 {
        margin-top: 2em;
        font-size: 18px;
        padding: 4vw;
        line-height: 1.5;
        margin-bottom: 1em
    }

    .note .entrybody h2:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        width: 100%;
        height: 100%;
        background: url(img/bg-dot.svg) repeat-y left top;
        background-size: auto;
        z-index: -1;
        opacity: .5
    }
}

.campaign-fixed {
    background: rgba(245, 151, 1, 0.8);
    color: #fff;
    font-weight: bold;
    text-align: center;
    display: block;
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 9999;
    font-size: 18px;
    padding: 10px 0;
}

.campaign-fixed .click {
    background: #000;
    max-width: 400px;
    width: 400px;
    padding: 8px 30px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.campaign-fixed .text {
    padding: 8px 0;
}

.campaign-fixed:hover {
    display: block;
    background: rgba(245, 151, 1, 1);
    opacity: 1;
}

.campaign-fixed .click:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 6%;
    width: 8px;
    height: 8px;
    background: url(img/arrow-w.svg) no-repeat center center;
    z-index: 9;
    background-size: contain;
}

@media screen and (max-width: 960px) {
    .campaign-fixed {
        bottom: auto;
        top: 61px;
        z-index: 10;
        font-size: 15px;
        padding: 0;
    }

    .campaign-fixed:after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        right: 6%;
        width: 8px;
        height: 8px;
        background: url(img/arrow-w.svg) no-repeat center center;
        z-index: 9;
        background-size: contain;
    }

    .campaign-fixed .text {
        padding: 0;
    }

    .campaign-fixed .click {
        display: none;
    }
}

.mitsumori-text {
    font-size: 14px;
}

.mitsumori-text .btn {
    text-align: center;
    color: #fff;
    margin: auto;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
スペシャルプラン
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
.special-plan .red {
    color: #d90000;
}

.special-plan #about-plan .sub-container .sub-wrapper .box {
    position: relative;
}

/* .special-plan #about-plan .sub-container.about--plan--content .sub-wrapper .box::before {
    content: "";
    display: inline-block;
    background-size: contain;
    background-image: url(./img/special--icon--plan.png);
    background-repeat: no-repeat;
    width: 114px;
    height: 114px;
    position: absolute;
    left: -20px;
    top: -20px;
    filter: drop-shadow(4px 0px 5px rgba(0, 0, 0, 0.15));
    z-index: 1;
} */

/* @media screen and (max-width: 960px) {
    .special-plan #about-plan .sub-container.about--plan--content .sub-wrapper .box::before {
        width: 70px;
        height: 70px;
    }
}
 */

.special-plan #about-plan .sub-container .sub-wrapper .box .flexbox.col2 .item:first-child {
    width: 40%;
}

.special-plan #about-plan .sub-container .sub-wrapper .box .flexbox.col2 .item:last-child {
    width: 60%;
}

@media screen and (max-width: 960px) {
    .special-plan #about-plan .sub-container .sub-wrapper .box .flexbox.col2 {
        display: block;
    }

    .special-plan #about-plan .sub-container .sub-wrapper .box .flexbox.col2 .item:first-child,
    .special-plan #about-plan .sub-container .sub-wrapper .box .flexbox.col2 .item:last-child {
        width: 100%;
    }

    .special-plan #about-plan .sub-container .sub-wrapper .box .flexbox.col2 .item:first-child {
        margin-bottom: 30px;
    }

}

.special-plan #about-plan .sub-container .sub-wrapper .box .mockup-ico img {
    height: 130px;
}

.special-plan #about-plan .sub-container .sub-wrapper .box .mockup-ico .mockup-ico__num {
    font-size: 17px;
    top: 28px;
}

.special-plan #about-plan .sub-container .sub-wrapper .box .section__title {
    font-weight: bold;
}

.special-plan #about-plan .sub-container .sub-wrapper .box .section__title.red {
    font-size: 40px;
    padding-top: 20px;
    position: relative;
    line-height: 1;
    margin-bottom: 20px;
}

.special-plan #about-plan .sub-container .sub-wrapper .box .section__title.red:before {
    content: "";
    position: absolute;
    top: 6px;
    left: 50%;
    margin-left: -6px;
    border: 6px solid transparent;
    border-top: 6px solid #000;
}

@media screen and (max-width: 960px) {
    .special-plan #about-plan .sub-container .sub-wrapper .box .section__title.red {
        padding-top: 20px;
        font-size: 26px;
    }

    .special-plan #about-plan .sub-container .sub-wrapper .box .section__title.red:before {
        top: 10px;
    }
}

.special-plan #about-plan .sub-container .sub-wrapper .box .bg-red {
    text-align: center;
    font-weight: bold;
    margin-left: auto;
    margin-right: auto;
    color: #fff;
}

.special-plan #about-plan .sub-container .sub-wrapper .box .bg-red .inner {
    display: inline-block;
    background: #d90000;
    padding: 4px 10px;
}

.special-plan #about-plan .sub-container.about--plan--merit .detail {
    font-size: 12px;
}

.special-plan #about-plan .sub-container.about--plan--merit .flexbox .item .ico-type--center {
    margin: 30px 0;
}

@media screen and (max-width: 960px) {
    .special-plan #about-plan .sub-container.about--plan--merit .flexbox .item .ico-type--center {
        margin: 20px 0;
    }
}

.special-plan #about-plan .sub-container.about--plan--merit .flexbox .item .ico-type--center img {
    width: 36px;
    height: auto;
    vertical-align: bottom;
}

.special-plan #about-plan .sub-container.about--plan--merit .flexbox .item .item__text .item__title {
    font-size: 20px;
}

@media screen and (max-width: 960px) {
    .special-plan #about-plan .sub-container.about--plan--merit .flexbox .item .item__text .item__title {
        font-size: 18px;
    }
}

.special-plan #about-plan .sub-container.about--plan--merit .flexbox .item .item__text .item__title span.small {
    font-size: 16px;
}

.special-plan #plan-recommended.container-type--bgrightgray .wrapper:after {
    right: auto;
    left: 0;
}

@media screen and (max-width: 960px) {
    .special-plan #plan-recommended.container-type--bgrightgray .wrapper:after {
        left: -8vw;
    }
}

.special-plan #plan-recommended.container-type--bgrightgray .sub-container .flexbox .item.box-type--num {
    padding: 0;
}

.special-plan #plan-recommended.container-type--bgrightgray .sub-container .flexbox .item.box-type--num .squarenum {
    padding: 15px 12px;
    width: 50px;
    height: 50px;
}

.special-plan #plan-recommended.container-type--bgrightgray .sub-container .flexbox .item.box-type--num .item__photo img {
    width: 100%;
    vertical-align: bottom;
}

.special-plan #plan-recommended.container-type--bgrightgray .sub-container .flexbox .item.box-type--num .item__title {
    font-size: 20px;
    text-align: left;
}

@media screen and (max-width: 960px) {
    .special-plan #plan-recommended.container-type--bgrightgray .sub-container .flexbox .item.box-type--num .item__title {
        font-size: 18px;
    }
}

.special-plan #plan-recommended.container-type--bgrightgray .sub-container .flexbox .item.box-type--num .item__text {
    padding: 20px;
}

@media screen and (max-width: 960px) {
    .special-plan #plan-recommended.container-type--bgrightgray .sub-container .flexbox .item.box-type--num .item__text {
        padding: 8vw;
    }

}

.special-plan #special--plan--conversion {
    background-image: url(./img/special--conversion--bg.png);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center -130px;
    color: #fff;
    position: relative;
    text-align: center;
}

.special-plan #special--plan--conversion:after {
    content: "";
    background: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    display: inline-block;
}

.special-plan #special--plan--conversion .heading {
    font-size: 34px;
    color: #fff;
    text-align: center;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    position: relative;
    z-index: 1;
    letter-spacing: 2.5px;
}

.special-plan #special--plan--conversion .heading span {
    font-size: 60px;
}

@media screen and (max-width: 960px) {
    .special-plan #special--plan--conversion .heading {
        font-size: 22px;
        line-height: 1.3;
        margin-bottom: 15px;
    }

    .special-plan #special--plan--conversion .heading span {
        font-size: 30px;
    }
}

.special-plan #special--plan--conversion .text {
    position: relative;
    z-index: 1;
}

.special-plan #special--plan--conversion .text-center .btn {
    margin-right: auto;
    margin-left: auto;
}

.kv .special--icon--link {
    z-index: 9;
    position: fixed;
    right: 50px;
    bottom: 150px;
    filter: drop-shadow(4px 0px 5px rgba(0, 0, 0, 0.15));
    width: 150px;
    height: 150px;
}

@media screen and (max-width: 960px) {
    .kv .special--icon--link {
        position: absolute;
        left: 10px;
        bottom: 150px;
        width: 120px;
        height: 120px;
        right: auto;
    }
}

.kv .special--icon--link img {
    width: 100%;
    height: auto;
}

.sub-container.special--banner a {
    display: block;
    width: 100%;
    height: 100%;
}

.sub-container.special--banner img {
    width: 100%;
}

.container.special--banner {
    padding-top: 0;
}

@media screen and (max-width: 960px) {
    .container.special--banner {
        padding-bottom: 0;
    }
}

.btn.btn--type--estimate {
    background: #fff;
    font-size: 16px;
    color: #f59701;
    border: solid #f59701 2px;
}

footer .btn.btn--type--estimate {
    background: #fff;
    font-size: 16px;
    color: #f59701;
    border: none;
}

.btn.btn--type--estimate:after {
    background: url(img/arrow-o.svg) no-repeat center center;
}

footer .btn.btn--type--conversion {
    margin-top: 10px;
}

header .fixed--btn a {
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    position: fixed;
    right: 0;
    top: 250px;
    background: #f59701;
    height: 180px;
    text-align: center;
    padding: 5px 15px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    letter-spacing: -4px;
    font-size: 18px;
    font-weight: normal;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

/* header .fixed--btn a:before {
    width: 0;
    height: 0;
    border-left: 40px solid transparent;
    border-right: 0px solid #f59701;
    border-bottom: 15px solid #f59701;
    position: absolute;
    content: "";
    display: inline-block;
    top: -15px;
    right: 0;
}

header .fixed--btn a:after {
    width: 0;
    height: 0;
    border-left: 40px solid transparent;
    border-right: 0px solid #f59701;
    border-bottom: 15px solid #f59701;
    position: absolute;
    content: "";
    display: inline-block;
    bottom: -15px;
    right: 0;
    transform: scale(-1, -1);
} */

header .fixed--btn a:last-child {
    top: 432px;
}

@media screen and (max-width: 960px) {
    header .fixed--btn {
        display: none;
    }
}

.tile__img.bg-or {
    background: #f59701;
    width: 60px;
    height: 60px;
    position: relative;
}

.tile__img.bg-or img {
    height: 28px;
    width: auto;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 9;
    margin: 0 auto;
    left: 0;
    right: 0;
}

/*===============================
20231121add -- PLAN
===============================*/
/* common */
.heading__bottom__dotted {
    font-size: 30px;
    margin-bottom: 50px;
    padding-bottom: 40px;
    position: relative;
    text-align: center;
}

.heading__bottom__dotted:after {
    content: "";
    display: block;
    width: 100px;
    height: 14px;
    background: url(img/dot.svg) no-repeat center;
    background-size: contain;
    opacity: .5;
    bottom: 0;
    position: absolute;
    left: calc(50% - 50px);
}

@media screen and (max-width: 960px) {
    .heading__bottom__dotted {
        font-size: 22px;
        margin-bottom: 30px;
        padding-bottom: 20px;
    }

    .heading__bottom__dotted:after {
        width: 50px;
        height: 13px;
        left: calc(50% - 25px);
    }
}



/* front - plan */
.container.frontplan {
    position: relative;
    overflow: hidden;
    margin-bottom: 50px;
}

@media screen and (max-width: 960px) {
    .container.frontplan {
        margin-bottom: 0;
    }
}

.container.frontplan::before {
    content: "";
    display: block;
    width: 100%;
    height: calc(100% - 150px);
    position: absolute;
    bottom: -160px;
    left: 0;
    background: linear-gradient(90deg, #ffb901 20.79688%, #fcb803 20.79688%, #02a4ef 41.92188%, #03a4eb 41.92188%, #7fba00 61.67188%, #80b800 61.67188%, #f25022 80.79688%);
    opacity: .2;
    z-index: -3;
}

@media screen and (max-width: 960px) {
    .container.frontplan::before {
        height: 100%;
        position: absolute;
        bottom: auto;
        top: calc(225px + 8vw);
    }
}

.container.frontplan .forntplan--label {
    width: 70px;
    position: absolute;
    bottom: -10px;
    right: calc(90% + 35px);
    opacity: .1;
}

@media screen and (max-width: 960px) {
    .container.frontplan .forntplan--label {
        display: none;
    }
}

.container.frontplan .frontplan--bg--wrap {
    position: relative;
}

.container.frontplan .frontplan--bg--wrap::before {
    content: "";
    display: block;
    width: 100%;
    height: calc(100% - 50px);
    position: absolute;
    bottom: -160px;
    left: 0;
    background: url(img/plan/frontplan--bg.png) no-repeat bottom center;
    background-size: cover;
    z-index: -4;
}

@media screen and (max-width: 960px) {
    .container.frontplan .frontplan--bg--wrap::before {
        height: 100%;
        position: absolute;
        bottom: auto;
        top: 225px;
    }
}

.container.frontplan .frontplan--bg--wrap::after {
    content: "";
    display: block;
    width: 100%;
    height: calc(100% - 110px);
    position: absolute;
    bottom: -100px;
    left: 0;
    background: url(img/dot-w.png);
    opacity: .5;
    z-index: -2;

}

@media screen and (max-width: 960px) {
    .container.frontplan .frontplan--bg--wrap::after {
        height: 100%;
        position: absolute;
        bottom: auto;
        top: 225px;
    }
}


.container.frontplan::after {
    content: "";
    display: block;
    width: 8%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff;
    z-index: -1;
}

@media screen and (max-width: 960px) {
    .container.frontplan::after {
        content: none;
    }
}

.container.frontplan .tile {
    padding: 40px 0px;
    position: relative;
    z-index: 0;
}

@media screen and (max-width: 960px) {
    .container.frontplan .tile {
        padding: 0 4vw;
    }

    .container.frontplan .tile .flexbox.col3 {
        display: block;
    }
}

.container.frontplan .tile .flexbox.col3 .item {
    width: calc(100% / 3);
    padding: 0 40px;
    border-right: 1px solid #eeeeee;
}

@media screen and (max-width: 960px) {
    .container.frontplan .tile .flexbox.col3 .item {
        width: 100%;
        padding: 20px 4vw;
        border-right: none;
        border-bottom: 1px solid #eeeeee;
        text-align: center;
        margin-top: 0;
    }
}

.container.frontplan .tile .flexbox.col3 .item:last-child {
    border-bottom: none;
}

.container.frontplan .tile .flexbox.col3 .item .ico-type--center {
    margin-top: 0;
}

@media screen and (max-width: 960px) {
    .container.frontplan .tile .flexbox.col3 .item .ico-type--center {
        margin-bottom: 15px;
        height: 50px;
    }

    .container.frontplan .tile .flexbox.col3 .item .ico-type--center img {
        width: 50px;
        height: auto;
    }

    .container.frontplan .tile .flexbox.col3 .item .item__title {
        margin-bottom: 15px;
    }

}

/* plan - page */
.plan .bottom100 {
    margin-bottom: 100px;
}

@media screen and (max-width: 960px) {
    .plan .bottom100 {
        margin-bottom: 8vw;
    }
}

.plan .tile {
    padding: 40px;
}

@media screen and (max-width: 960px) {
    .plan .tile {
        padding: 4vw;
    }
}

.plan .heading--left--dotted {
    margin-top: 0;
    position: relative;
    font-size: 28px;
    line-height: 1.5;
    padding-left: 30px;
    margin-bottom: 30px;
}

.plan .heading--left--dotted::before {
    content: "";
    display: block;
    width: 6px;
    height: 100%;
    background: url(img/dot-y.svg) repeat-y left top;
    background-size: cover;
    position: absolute;
    top: 2px;
    left: 0;
    opacity: .5;
}

@media screen and (max-width: 960px) {
    .plan .heading--left--dotted {
        font-size: 18px;
        margin-bottom: 15px;
        padding-left: 20px;
        min-height: 44px;
    }
}

.plan .box--gradation {
    background: #fff;
    padding: 40px;
    text-align: center;
    border: 1px solid #fff;
    border-image: linear-gradient(to right, #ffdc80 20%, #80d1f7 40%, #bfdc7f 60%, #f8a790 80%);
    border-image-slice: 1;
    margin-bottom: 60px;
}

@media screen and (max-width: 960px) {
    .plan .box--gradation {
        padding: 8vw;
        margin-bottom: 4vw;
    }
}

.plan .heading--side--dotted {
    margin: 0 auto 30px;
    font-size: 28px;
    display: inline-block;
    position: relative;
}

.plan .heading--side--dotted:before,
.plan .heading--side--dotted:after {
    content: "";
    display: inline-block;
    width: 70px;
    height: 10px;
    background: url(img/dot.svg) no-repeat center;
    background-size: contain;
    position: absolute;
    top: calc(50% - 5px);
    opacity: .5;
}

.plan .heading--side--dotted:before {
    left: -85px;
}

.plan .heading--side--dotted:after {
    right: -85px;
}

@media screen and (max-width: 960px) {
    .plan .heading--side--dotted {
        margin: 0 auto 30px;
        font-size: 20px;
    }

    .plan .heading--side--dotted:before,
    .plan .heading--side--dotted:after {
        width: 35px;
        height: 5px;
        top: calc(50% - 2.5px);
    }

    .plan .heading--side--dotted:before {
        left: calc(50% - 17.5px);
        top: auto;
        bottom: -10px;
    }

    .plan .heading--side--dotted:after {
        content: none;
    }

}

.plan .plan--table {
    display: flex;
    display: -webkit-flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    align-items: flex-end;
    -webkit-align-items: flex-end;
    justify-content: center;
    -webkit-justify-content: center;
    margin-bottom: 60px;
}

@media screen and (max-width: 960px) {
    .plan .plan--table {
        margin-bottom: 4vw;
    }
}

.plan .plan--table .plan--table--item {
    flex: 0 0 33.33333333%;
    background: #fff;
    text-align: center;
    border: 1px solid #ddd;
    box-sizing: border-box;
    margin-bottom: 5px;
}

.plan .plan--table .plan--table--item h3 {
    background: #ffb901;
    color: #fff;
    padding: 25px 20px;
    margin: 0;
    font-size: 28px;
    line-height: 1;

}

@media screen and (max-width: 960px) {
    .plan .plan--table .plan--table--item h3 {
        padding: 20px 10px;
        font-size: 22px;
    }
}

.plan .plan--table .plan--table--item.regular {
    border: 5px solid #f25022;
    margin-bottom: 0;
}

.plan .plan--table .plan--table--item.regular h3 {
    background: #f25022;
    color: #fff;
    padding: 35px 20px;
    margin: 0;
    line-height: 1;
}

@media screen and (max-width: 960px) {
    .plan .plan--table .plan--table--item.regular h3 {
        padding: 20px 10px;
    }
}

.plan .plan--table .plan--table--item.regular h3 span {
    color: #f25022;
    background: #fff;
    padding: 10px 30px;
    border-radius: 100px;
    display: inline-block;
    font-size: 18px;
    margin-bottom: 15px;
}

@media screen and (max-width: 960px) {
    .plan .plan--table .plan--table--item.regular h3 span {
        padding: 5px 30px;
        font-size: 15px;
    }
}

.plan .plan--table .plan--table--item h4 {
    font-size: 50px;
    margin: 0 auto;
    line-height: 1.2;
}

.plan .plan--table .plan--table--item h4 span {
    font-size: 30px;
}

@media screen and (max-width: 960px) {
    .plan .plan--table .plan--table--item h4 {
        font-size: 36px;
    }

    .plan .plan--table .plan--table--item h4 span {
        font-size: 20px;
    }
}

.plan .plan--table .plan--table--item .table--cell {
    padding: 20px 10px;
}

@media screen and (max-width: 960px) {
    .plan .plan--table .plan--table--item .table--cell {
        padding: 10px;
    }
}

.plan .plan--table .plan--table--item table {
    border: none;
    border-spacing: 0
}

.plan .plan--table .plan--table--item table .bg-gray {
    background: #f6f6f6;
}

.plan .plan--table .plan--table--item table tbody tr th,
.plan .plan--table .plan--table--item table tbody tr td {
    border: none;
    border-top: 1px solid #ddd;
    background: #fff;
}

.plan .plan--table .plan--table--item table tbody tr th {
    color: #a3a3a3;
    font-weight: normal;
    width: 40%;
}

.plan .plan--table .plan--table--item table tbody tr td {
    font-size: 22px;
    text-align: center;
    width: 60%;
}

@media screen and (max-width: 1000px) {
    .plan .plan--table {
        flex-direction: column;
        -webkit-flex-direction: column;
    }

    .plan .plan--table .plan--table--item {
        flex: 0 0 auto;
        -webkit-flex: 0 0 auto;
        width: 100%;
    }

    .plan .plan--table .plan--table--item.regular {
        order: 1;
        -webkit-order: 1;
        margin-bottom: 4vw;
    }

    .plan .plan--table .plan--table--item.startup {
        order: 2;
        -webkit-order: 2;
        margin-bottom: 4vw;
    }

    .plan .plan--table .plan--table--item.premium {
        order: 3;
        -webkit-order: 3;
        margin-bottom: 0;
    }

    .plan .plan--table .plan--table--item table tbody tr td {
        font-size: 18px;
    }
}

.plan .plan--lineup .btn:after {
    transform: rotate(90deg);
    top: calc(50% - 4px);
}

.plan .tile {
    margin-bottom: 50px;
}

@media screen and (max-width: 960px) {
    .plan .tile {
        margin-bottom: 4vw;
    }
}

.plan .tile .flexbox.col4 .item.bg-gray .ico-type--center {
    height: auto;
    margin-bottom: 0;
    max-height: 70px;
}

@media screen and (max-width: 960px) {
    .plan .tile .flexbox.col4 {
        display: flex;
    }

    .plan .tile .flexbox.col4 .item.bg-gray {
        width: 49.5%;
        margin: 0 0 1% 0;
    }

    .plan .tile .flexbox.col4 .item.bg-gray .ico-type--center {
        max-height: 60px;
    }
}

.plan .tile .flexbox.col4 .item.bg-gray .ico-type--center img {
    width: 60px;
}

@media screen and (max-width: 960px) {
    .plan .tile .flexbox.col4 .item.bg-gray .ico-type--center img {
        width: 40px;
    }
}

.plan .tile .flexbox.col4 .item.bg-gray .item__title {
    font-weight: bold;
}

@media screen and (max-width: 960px) {
    .plan .tile .flexbox.col4 .item.bg-gray .item__title {
        font-size: 15px;
    }

}

.plan .plan--ordermade--point .flexbox.col3 {
    margin-top: 80px;
}

@media screen and (max-width: 960px) {
    .plan .plan--ordermade--point .box--gradation {
        margin-bottom: 30px;
    }

    .plan .plan--ordermade--point .flexbox.col3 {
        margin-top: 0;
    }
}

.plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num {
    padding: 0;
}

@media screen and (max-width: 960px) {
    .plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num {
        margin-bottom: 4vw;
    }

    .plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num:last-child {
        margin-bottom: 0;
    }
}


.plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .plan--point--number {
    font-weight: bold;
    font-size: 20px;
    text-align: center;
    position: absolute;
    width: 100%;
    left: 0;
    top: -52px;
}

.plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .plan--point--number span {
    font-size: 40px;
}

@media screen and (max-width: 960px) {
    .plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .plan--point--number {
        font-size: 16px;
        top: -40px;
    }

    .plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .plan--point--number span {
        font-size: 30px;
    }
}

.plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .plan--point--photo img {
    vertical-align: bottom;
    width: 100%;
}

.plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .item__text {
    padding: 25px 20px;
}

@media screen and (max-width: 960px) {
    .plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .item__text {
        padding: 20px;
    }
}

.plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .item__text .item__title {
    font-size: 20px;
    line-height: 1.5;
    text-align: center;
    margin-bottom: 20px;
}

@media screen and (max-width: 960px) {
    .plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .item__text .item__title {
        font-size: 18px;
        margin-bottom: 10px;
    }
}

.plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .item__text .item__title .red {
    color: #d90000;
}

.plan .plan--ordermade--point .flexbox.col3 .item.box.box-type--border.box-type--num .item__text .item__title span.small {
    font-size: 16px;
}

.plan .plan--ordermade--point .attention {
    font-size: 12px;
    margin-bottom: 60px;
}


@media screen and (max-width: 960px) {
    .plan .plan--ordermade--point .attention {
        margin-bottom: 8vw;
    }
}

.plan .plan--ordermade--point .tile {
    margin-bottom: 0;
}

.plan .plan--ordermade--point .tile .btn {
    width: 66%;
}

@media screen and (max-width: 960px) {
    .plan .plan--ordermade--point .tile .btn {
        width: 100%;
    }
}

.plan .plan--marketing .bg-gray {
    text-align: center;
    padding: 40px;
    margin-bottom: 60px;
}

@media screen and (max-width: 960px) {
    .plan .plan--marketing .bg-gray {
        padding: 20px;
        margin-bottom: 4vw;
    }
}


.plan .plan--marketing .bg-gray .heading--side--dotted {
    font-size: 24px;
}

@media screen and (max-width: 960px) {
    .plan .plan--marketing .bg-gray .heading--side--dotted {
        font-size: 18px;
    }
}

.plan .plan--marketing .bg-gray .tile {
    margin-bottom: 0;
}

.plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex {
    align-items: center;
    line-height: 1;
}

@media screen and (max-width: 960px) {
    .plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex {
        display: block;
    }
}

.plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item {
    width: 50%;
}

@media screen and (max-width: 960px) {
    .plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item {
        width: 100%;
    }

    .plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .flexbox.marketing--ex--item {
        display: block;
    }
}

.plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item .bg-black {
    background: #000;
    color: #fff;
    font-weight: bold;
    text-align: center;
    width: calc((100% - 1px)/2);
    padding: 10px;
}

@media screen and (max-width: 960px) {
    .plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item .bg-black {
        width: 100%;
        margin-bottom: 1px;
    }
}

.plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item.orange {
    text-align: right;
    color: #f25022;
    font-size: 50px;
    font-weight: bold;
}

.plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item.orange span.yen {
    font-size: 30px;
}

.plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item.orange span.small {
    font-size: 24px;
}

@media screen and (max-width: 960px) {
    .plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item.orange {
        margin-top: 15px;
        font-size: 32px;
        text-align: center;
    }

    .plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item.orange span.yen {
        font-size: 24px;
    }

    .plan .plan--marketing .bg-gray .tile .flexbox.marketing--ex .marketing--ex--item.orange span.small {
        font-size: 18px;
    }

}

.plan .plan--marketing .flexbox.col6 .item {
    position: relative;
    width: 16%;
    box-shadow: 0 0 5px #ddd;
}

@media screen and (max-width: 960px) {
    .plan .plan--marketing .flexbox.col6 .item {
        width: 49.5%;
        margin-bottom: 1%;
        padding: 20px 10px;
    }
}

.plan .plan--marketing .flexbox.col6 .item::after {
    content: "";
    display: inline-block;
    border-left: 10px solid transparent;
    border-bottom: 10px solid#000;
    height: 0;
    width: 0;
    position: absolute;
    right: 10px;
    bottom: 10px
}

.plan .plan--marketing .flexbox.col6 .item .ico-type--center {
    margin-bottom: 10px;
    margin-top: 10px;
}

.plan .plan--marketing .flexbox.col6 .item .ico-type--center img {
    width: 50px;
    height: auto;
}

@media screen and (max-width: 960px) {
    .plan .plan--marketing .flexbox.col6 .item .ico-type--center img {
        width: 40px;
    }
}

.plan .plan--marketing .flexbox.col6 .item .item__text .item__title {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media screen and (max-width: 960px) {
    .plan .plan--marketing .flexbox.col6 .item .item__text .item__title {
        min-height: auto;
        font-size: 15px;
    }
}

/*# sourceMappingURL=style.css.map */