@charset "utf-8";
@charset "UTF-8";
@charset "UTF-8";
@charset "utf-8";
@charset "utf-8";
@charset "utf-8";
@charset "utf-8";

    .front-news-container {
max-width: 720px; margin: 0 auto;
padding: 0 20px;
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
#widget-recommend h3 {
text-align: center;
background: #C00;
color: #fff;
box-shadow: 0 0 0 0;
padding: 1em 0;
line-height: 1em;
margin: 0 auto;
} .widget-selected-posts h3 {
text-align: center;
background: #C00;
color: #fff;
box-shadow: 0 0 0 0;
padding: 1em 0;
line-height: 1em;
margin: 0 auto;
}   .veu_cta .cta_title_custom, .cta_title_custom{
display: block !important;
overflow: hidden !important;
margin: 0 !important;
padding: 12px 20px 10px !important;
background-color: #333 !important;
color: #fff !important;
font-size: 22px !important;
line-height: 1.2 !important;
text-align: center !important;
border-left: none !important;
}   .veu_relatedPosts h3{
color: #c00 !important;
text-align: center !important;
line-height: 1.3em !important;
margin-bottom: 1em !important;
font-weight: bold !important;
background-color: #f5f5f5 !important;
padding: 14px 10px 10px !important;
border-left: none !important;
border-top: 2px solid #c00 !important;
border-bottom: 1px solid #e9e9e9 !important;
margin: 1.5em 0 1.2em !important;
clear: both !important;
font-size: 18px !important;
}
@media screen and (max-width: 768px) { .veu_cta h4 {
border: none !important;
border-left: #C00 3px solid !important;
line-height: 1.3em !important;
text-indent: 0 !important;
font-size: 22px !important;
font-weight: bold !important;
margin-bottom: 1.2em !important;
padding: 0.5em !important;
background: #eee !important;
}
}  .news-list-simple {
list-style: none;
padding: 0;
margin: 0;
border-top: 1px solid #eee; } .news-item-simple {
border-bottom: 1px solid #eee;
}
.news-item-simple a {
display: flex;
align-items: center; padding: 15px 10px;
text-decoration: none;
color: #333;
transition: background 0.3s;
}
.news-item-simple a:hover {
background-color: #f9f9f9;
} .news-date {
flex-basis: 120px;
flex-shrink: 0;
font-size: 14px;
color: #666;
font-family: 'Arial', sans-serif;
} .news-label {
flex-shrink: 0;
display: inline-block;
padding: 3px 12px;
font-size: 11px;
font-weight: bold;
color: #fff;
border-radius: 4px;
margin-right: 20px; text-align: center;
min-width: 90px; } .news-title {
flex-grow: 1;
font-size: 15px;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .type-release { background-color: #ff8e8e; }
.type-media   { background-color: #ffc107; }
.type-heading    { background-color: #87cefa; }
.type-event   { background-color: #a2d149; }
.type-other  { background-color: #666; } @media (max-width: 768px) {
.news-item-simple a {
flex-wrap: wrap; padding: 12px 5px;
}
.news-date {
flex-basis: 100px;
font-size: 12px;
}
.news-label {
margin-right: 0;
margin-bottom: 5px; }
.news-title {
flex-basis: 100%; font-size: 14px;
white-space: normal; }
}

html,body{
font-family: "Noto Sans JP", sans-serif;
font-size: 14px;
color: #2A2A2A;
}
img{
height: auto;
max-width: 100%;
}
a {
transition: 0.3s;
color: #cc0000;
transition: .5s;
}
a:hover {
color: #cc0000;
opacity: .7;
}
a:hover:after {
transform: scaleX(1);
}
ul,li{
margin: 0;
padding: 0;
list-style: none;
}
dt,dd{
border: none;
padding: 0;
}
table {
border: none;
margin: 0 auto;
}
table td, table th {
border: none;
}
table td .form-control, table th .form-control {
max-width: 100%;
}
.siteContent > .container-fluid{
padding-right: 0;
padding-left: 0;
}
h1.entry-title:first-letter,
.single h1.entry-title:first-letter {
color:inherit;
}
h2, .mainSection-title {
border-top: none;
font-size: 18px;
}
.mainSection-title, h2 {
border-top: none;
border-bottom: none;
background: none;
padding: 0;
line-height: 1em;
}
.subSection-title, h3 {
border-bottom: none;
box-shadow: 0 0 0 0;
line-height: 1em;
}
h3:after, .subSection-title:after {
border-bottom: none;
}
.row-eq-height {
display: flex;
flex-wrap: wrap;
}
.siteHeader{
box-shadow: 0 0 0 0;
}
.siteHeader .container {
width: 100%;
max-width: 1200px;
}
.siteHeader .siteHeadContainer:after {
content: none;
}
.siteHeader.navbar {
border: none;
padding: 0;
position: fixed;
}
.navbar-header {
display: flex;
justify-content: space-between;
align-items: center;
}
.container-fluid>.navbar-header,
.container>.navbar-header {
margin-right: -15px;
margin-left: -15px;
width: calc(100% + 30px);
}
.navbar-header:before,
.navbar-header:after{
content: none;
}
.siteHeader_logo {
width: auto;
}
.navbar-brand {
padding: 5px 0;
margin: 0;
}
.navbar-brand img {
max-width: 250px; margin: 0 auto 0 15px;
}
.header-right a {
display: block;
padding: .5em;
text-align: center;
line-height: 1.2;
}
.header-right a span{
font-size: .8em;
}
.nav li a {
color: #595757;
}
.nav > li > a {
padding: 10px 2px;
margin: 0 13px;
}
ul.gMenu a:hover {
color: inherit;
background: rgba(0,0,0,.03);
}
ul.gMenu > li > span {
border-bottom: none;
padding: 10px 2px;
margin: 0 13px;
display: block;
}
ul.gMenu > li > span:after {
transition: all 0.3s ease-in-out 0s;
}
ul.gMenu > li > span:hover:after {
content: ".";
line-height: 0;
bottom: 0;
display: block;
overflow: hidden;
position: absolute;
width:100%;
left: 0;
border-bottom: 4px solid #cc0000;
}
ul.gMenu_cta > li > .sub-menu > li {
margin: 10px 0;
}
ul.gMenu_cta > li > a.btn,
ul.gMenu_cta > li > .sub-menu > li > a.btn {
position: relative;
padding: 10px 20px;
margin-right: 0;
border-radius: 100px;
background-color: #c00;
border: 2px solid #c00;
color: #fff;
}
ul.gMenu_cta > li > .sub-menu > li > a.btn {
padding-right: 40px;
}
ul.gMenu_cta > li > .sub-menu > li > a.btn:after {
content: '';
position: absolute;
top: 0;
bottom: 0;
right: 1.2em;
width: 1.2em;
height: 1em;
display: block;
margin: auto;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_download_white.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
ul.gMenu_cta > li > .sub-menu > li > a.btn:hover {
background-color: #c00;
color: #fff;
}
ul.gMenu_cta > li > a.btn-secondary,
ul.gMenu_cta > li > .sub-menu > li > a.btn-secondary {
background-color: #fff;
border: 2px solid #c00;
color: #5E5B55;
}
ul.gMenu_cta > li > .sub-menu > li > a.btn-secondary:after {
width: 0.7em;
height: 0.7em;
background-image: none;
border-right: 1px solid #c00;
border-bottom: 1px solid #c00;
transform: rotate(-45deg);
}
ul.gMenu_cta > li > .sub-menu > li > a.btn-secondary:hover {
background-color: #fff;
color: #5E5B55;
}
ul.gMenu > li > ul.sub-menu {
display: none;
top: 100%;
left: 0;
margin-left: 13px;
padding: 1em;
box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, .2);
background-color: #fff;
}
ul.gMenu > li > ul.sub-menu li {
background-color: #fff;
}
ul.gMenu > li > ul.sub-menu li a {
display: block;
color: #595757;
padding: .5em 0;
font-size: 14px;
}
ul.gMenu > li > ul.sub-menu li a:hover {
background-color: #fff;
color: #c00;
}
.gMenu_outer nav {
display: flex;
}
.gMenu_outer nav .tel {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin: 0 7px;
text-align: center;
font-weight: 700;
line-height: 1.6;
}
.gMenu_outer nav .tel a {
display: block;
font-size: 14px;
padding-left: 25px;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_tel_header.png);
background-repeat: no-repeat;
background-position: left;
background-size: contain;
color: #c00;
}
.gMenu_outer nav .tel span {
display: block;
font-size: 10px;
}
.page-template-page-lp .siteContent,
.page-template-page-lp2 .siteContent,
.page-template-page-lp-builder .siteContent {
padding: 3.5em 0 3.5em;
margin-top: 60px;
}
.home.page-template-page-lp .siteContent,
.home.page-template-page-lp-builder .siteContent {
margin-top: 0;
}
.entry-body h1{
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
.entry-body h1 span{
font-size: 15px;
line-height: 1.3em;
}
.entry-body h1 span:before{
content: "\A" ;
white-space: pre ;
}
.link_button,
.btn-primary.link_button{
padding: 0.7em 1em;
border: 3px solid #cc0000;
border-radius: 2em;
font-size: 20px;
background: #F9E5E6;
position: relative;
width: 100%;
display: block;
text-align: center;
margin: 1em auto;
color: #cc0000!important;
transition: 0.3s;
}
.link_button:hover,
.btn-primary.link_button:hover{
border: 3px solid #cc0000;
background: #cc0000;
color: #fff!important;
text-decoration: none;
}
.link_button p,
.btn-primary.link_button p{
margin: 0 auto;
text-align: center;
position: relative;
display: inline-block;
font-weight: bold;
}
.link_button p:after,
.btn-primary.link_button p:after{
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0.5em 0 0.5em 0.6em;
border-color: transparent transparent transparent #cc0000;
position: absolute;
top: calc(50% - 0.5em);
right: -1.2em;
}
.link_button:hover p:after,
.btn-primary.link_button:hover p:after{
border-color: transparent transparent transparent #fff;
}
.link_button_outer,
.btn-primary.link_button_outer{
position: relative;
}
.link_button_outer:after,
.btn-primary.link_button_outer:after{
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0.6em 0 0.6em 0.7em;
border-color: transparent transparent transparent #cc0000;
position: absolute;
top: calc(50% - 0.6em);
right: calc(10% + 1em);
margin-left: 1em;
}
.link_button_outer:hover:after,
.btn-primary.link_button_outer:hover:after{
border-color: transparent transparent transparent #fff;
}
div.wpcf7 .ajax-loader {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.wpcf7-spinner {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
#block01{
margin: 0 auto 25px;
padding: 0 0 25px 0;
}
#block02,
#block03,
#block04,
#block05,
#block06,
#block07,
#block08,
#block09,
#block10,
#block11{
margin: 25px auto;
padding: 25px 0;
}
.siteContent_after {
background: #cc0000;
text-align: center;
}
.siteContent_after h3{
background: url(//help-you.me/wp1/wp-content/uploads/2017/08/logo.png) center top no-repeat;
text-indent: -9999px;
background-size: 200px;
height: 35px;
}
.siteFooter {
position: relative;
border: none;
background: #cc0000;
color: #fff;
padding-top: 80px;
}
.siteFooter a {
color: #fff;
text-decoration: none;
}
.siteFooter .container {
max-width: 940px;
}
.siteFooter .sectionBox {
padding: 0;
}
.siteFooter .footerMenu {
border: none;
}
.siteFooter .widget {
margin-bottom: 0;
}
.siteFooter .widget-title {
font-size: 14px;
border: none;
padding: 3px 0;
line-height: 1.65em;
font-weight: 700;
}
.siteFooter .widget_nav_menu ul li a {
border-bottom: none;
color: #fff;
box-shadow: 0 0 0 0;
padding: 3px 0;
}
.siteFooter .menu > li > a {
font-weight: 700;
}
.siteFooter .menu a[target="_blank"]:after {
content: '';
display: inline-block;
width: 1em;
height: 1em;
margin-left: .5em;
vertical-align: text-top;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_blank_white.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.siteFooter .sub-menu > li {
padding-left: 15px;
}
.siteFooter .sectionBox .row .col-md-4:nth-child(1),
.siteFooter .sectionBox .row .col-md-4:nth-child(2) {
width: 50%;
}
.siteFooter .sectionBox .row .col-md-4:nth-child(3) {
position: relative;
margin-top: 20px;
margin-bottom: 20px;
padding-top: 20px;
padding-bottom: 20px;
}
.siteFooter .sectionBox .row .col-md-4:nth-child(3)::before,
.siteFooter .sectionBox .row .col-md-4:nth-child(3)::after {
content: '';
position: absolute;
left: 0;
right: 0;
margin: 0 auto;
display: block;
width: calc(100% - 30px);
border-top: 1px solid #fff;
}
.siteFooter .sectionBox .row .col-md-4:nth-child(3)::before {
top: 0;
}
.siteFooter .sectionBox .row .col-md-4:nth-child(3)::after {
bottom: 0;
}
.siteFooter .sectionBox .row .col-md-4:nth-child(3) .menu li {
padding-left: 15px;
}
.siteFooter .sectionBox .row .col-md-4:nth-child(3) .menu li a {
font-weight: normal;
}
.siteFooter .company .logo {
position: absolute;
top: 30px;
left: 15px;
width: 157px;
}
.siteFooter .company .badge {
display: flex;
}
.siteFooter .company .badge li {
margin-right: 10px;
}
.siteFooter .company .badge li a {
display: block;
}
.siteFooter .company .badge li a img {
width: auto;
height: 40px;
}
.siteFooter .footerMenu {
color: #5E5B55;
background-color: #fff;
margin-top: 20px;
padding: 15px 0 20px;
text-align: center;
}
.siteFooter .footerMenu .menu {
display: flex;
justify-content: center;
margin-bottom: 5px;
}
.siteFooter .footerMenu li {
margin: 0 20px;
}
.siteFooter .footerMenu li a {
font-weight: normal;
padding: 0;
margin: 0;
border: none;
}
.siteFooter .footerMenu a[target="_blank"]:after {
content: '';
display: inline-block;
width: 1em;
height: 1em;
margin-left: .5em;
vertical-align: text-top;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_blank_black.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.page-id-5328 .siteFooter,
.page-id-2199 .siteFooter,
.page-id-4647 .siteFooter{
display: none;
}
.page_top_btn {
background-color: rgba(204,0,0,.8);
background-image: url(//help-you.me/wp1/wp-content/plugins/vk-all-in-one-expansion-unit/assets/images/to-top-btn-icon.svg);
background-size: 50%;
background-repeat: no-repeat;
background-position: center;
outline: rgba(204,0,0,.8) solid 1px;
border: 1px solid rgba(255,255,255,.8);
}
.vk-mobile-nav,
.vk-mobile-nav .btn {
font-size: 14px;
line-height: 1.5;
}
.vk-mobile-nav nav>ul {
border-top: none;
}
.vk-mobile-nav .widget_nav_menu ul li a, .vk-mobile-nav nav ul li a,
body#new nav.global-nav a, body#new nav.vk-mobile-nav-menu-outer a {
color: #5E5B55 !important;
border-bottom: none;
}
.vk-mobile-nav .widget_nav_menu ul li span, .vk-mobile-nav nav ul li span {
color: #5E5B55;
border-bottom: none;
padding: 0.7em 0.5em;
display: block;
}
.vk-mobile-nav nav ul li:nth-child(7) br {
display: none;
}
.vk-mobile-nav nav ul li:nth-child(7) span {
padding: 0;
display: inline-block;
font-size: 15px;
}
.vk-menu-acc > li {
border-bottom: 1px solid #D6D6D6;
}
.vk-menu-acc > li:nth-last-child(1),
.vk-menu-acc > li:nth-last-child(2) {
display: none;
}
.vk-menu-acc .acc-btn {
border: none;
}
.vk-menu-acc li.menu-item-has-children > a {
pointer-events: none;
}
.vk-menu-acc li.menu-item-has-children > .acc-btn {
top: 0;
right: 0;
width: 100%;
height: 3.1em;
background-position: right;
background-size: 28px;
}
.vk-mobile-nav-menu-btn {
left: auto;
right: 5px;
border: none;
background-color: transparent;
}
.vk-mobile-nav-menu-btn.menu-open {
border: none;
background-color: transparent;
}
.vk-menu-acc .sub-menu li a {
padding: .7em .5em .7em 1.5em;
border-top: 1px solid #D6D6D6;
} .vk-mobile-nav-widget.widget_vkexunit_button .btn {
position: relative;
margin: 0 auto;
padding: 10px;
max-width: 20em;
border-radius: 100px;
}
.vk-mobile-nav-widget.widget_vkexunit_button .btn.btn-default,
.vk-mobile-nav-widget.widget_vkexunit_button .btn.btn-default:hover {
background-color: #fff;
color: #5E5B55;
}
.vk-mobile-nav-widget.widget_vkexunit_button:nth-last-child(4) .btn,
.vk-mobile-nav-widget.widget_vkexunit_button:nth-last-child(3) .btn {
position: relative;
}
.vk-mobile-nav-widget.widget_vkexunit_button:nth-last-child(4) .btn:after,
.vk-mobile-nav-widget.widget_vkexunit_button:nth-last-child(3) .btn:after {
content: '';
position: absolute;
top: 0;
bottom: 0;
right: 1.2em;
width: 1.2em;
height: 1em;
display: block;
margin: auto;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_download_white.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.vk-mobile-nav-widget.widget_vkexunit_button:nth-last-child(3) .btn:after {
width: 0.7em;
height: 0.7em;
background-image: none;
border-right: 1px solid #c00;
border-bottom: 1px solid #c00;
transform: rotate(-45deg);
}
.vk-mobile-nav-widget.widget_custom_html .tel {
text-align: center;
}
.vk-mobile-nav-widget.widget_custom_html .tel a {
display: inline-block;
padding-left: 22px;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_tel_black.svg);
background-repeat: no-repeat;
background-position: 0 0;
background-size: 22px auto;
color: #5E5B55;
}
@media screen and (max-width: 767px) {
.siteHeader .container {
width: calc(100% - 50px);
margin-left: 0;
}
#satori__creative_container{
display: none;
}
}
@media screen and (min-width: 768px) {
.header_scrolled .gMenu_outer {
position: static;
width: auto;
background-color: transparent;
-webkit-box-shadow: none;
box-shadow: none;
}
ul.gMenu > li > a:after {
transition: all 0.3s ease-in-out 0s;
}
ul.gMenu > li > a:hover:after, ul.gMenu > li.current-post-ancestor > a:after, ul.gMenu > li.current-menu-item > a:after, ul.gMenu > li.current-menu-parent > a:after, ul.gMenu > li.current-menu-ancestor > a:after, ul.gMenu > li.current_page_parent > a:after, ul.gMenu > li.current_page_ancestor > a:after { border: none;
}
ul.gMenu > li:nth-last-child(2) > a:hover:after, ul.gMenu > li:nth-last-child(2).current-post-ancestor > a:after, ul.gMenu > li:nth-last-child(2).current-menu-item > a:after, ul.gMenu > li:nth-last-child(2).current-menu-parent > a:after, ul.gMenu > li:nth-last-child(2).current-menu-ancestor > a:after, ul.gMenu > li:nth-last-child(2).current_page_parent > a:after, ul.gMenu > li:nth-last-child(2).current_page_ancestor > a:after,
ul.gMenu > li:last-child > a:hover:after, ul.gMenu > li:last-child.current-post-ancestor > a:after, ul.gMenu > li:last-child.current-menu-item > a:after, ul.gMenu > li:last-child.current-menu-parent > a:after, ul.gMenu > li:last-child.current-menu-ancestor > a:after, ul.gMenu > li:last-child.current_page_parent > a:after, ul.gMenu > li:last-child.current_page_ancestor > a:after {
border-bottom: none;
}
ul.gMenu > li:nth-child(7) > a:hover:after, ul.gMenu > li:nth-child(7).current-post-ancestor > a:after, ul.gMenu > li:nth-child(7).current-menu-item > a:after, ul.gMenu > li:nth-child(7).current-menu-parent > a:after, ul.gMenu > li:nth-child(7).current-menu-ancestor > a:after, ul.gMenu > li:nth-child(7).current_page_parent > a:after, ul.gMenu > li:nth-child(7).current_page_ancestor > a:after {
border:none;
}
.gMenu > li:before, .gMenu > li.menu-item-has-children::after {
border: none;
}
.gMenu > li.menu-item-has-children {
margin-bottom: -14px;
padding-bottom: 14px;
} .gMenu > li.menu-item-has-children:hover > ul.sub-menu {
display: block;
}
.gMenu>li .gMenu_name {
font-weight: normal;
}
.link_button,
.btn-primary.link_button{
width: 100%;
font-size: 22px;
}
.siteFooter .widget {
margin-bottom: 20px;
}
.siteFooter .sectionBox .row .col-md-4:nth-child(3) {
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
.siteFooter .sectionBox .row .col-md-4:nth-child(3)::before,
.siteFooter .sectionBox .row .col-md-4:nth-child(3)::after {
content: none;
}
}
@media screen and (min-width: 992px){ .container {
width: 940px;
}
.container-fluid>.navbar-header,
.container>.navbar-header {
width: auto;
margin-left: 0;
}
.navbar-brand img {
margin: 0 auto;
}
.header-right {
display: none;
}
.vk-mobile-nav nav ul li:nth-child(7) br {
display: block;
}
.header_scrolled .navbar-header {
margin-bottom: 0;
}
.header_scrolled .gMenu_outer nav {
display: flex;
width: auto;
padding-left: 0;
padding-right: 0;
}
.header_scrolled .gMenu_outer .gMenu {
width: auto;
padding: 0;
}
.header_scrolled .gMenu>li {
width: auto;
border-left: none;
}
.header_scrolled .gMenu>li:first-child {
border-left: none;
}
.header_scrolled .gMenu>li:last-child {
border-right: none;
}
.page-template-page-lp .siteContent,
.page-template-page-lp2 .siteContent,
.page-template-page-lp-builder .siteContent {
margin-top: 86px;
padding: 3.5em 0 3.5em;
}
#block01{
margin: 0 auto 50px;
padding: 0 0 50px 0;
}
#block02,
#block03,
#block04,
#block05,
#block06,
#block07,
#block08,
#block09,
#block10,
#block11{
margin: 50px auto;
padding: 50px 0;
}
.nav > li > a,
.device-pc .gMenu>li>a {
margin: 0 7px;
padding: 10px 2px;
border: 2px solid transparent;
}
.gMenu_outer {
width: auto;
} .siteFooter {
font-size: 14px;
padding: 0;
}
.siteFooter > .container {
display: flex;
justify-content: space-between;
padding: 40px 15px 20px;
}
.siteFooter .sectionBox {
order: 2;
width: 65%;
}
.siteFooter .company {
order: 1;
margin-bottom: 20px;
}
.siteFooter .company p {
margin-bottom: 1.2em;
}
.siteFooter .company .logo {
position: relative;
top: 0;
left: 0;
margin-bottom: 20px;
}
.siteFooter .company .badge li {
margin-right: 18px;
}
.siteFooter .company .badge li a img {
height: 54px;
}
.siteFooter .footerMenu {
margin-top: 0;
}
.siteFooter .footerMenu .container {
display: flex;
justify-content: space-between;
}
.siteFooter .footerMenu .menu {
justify-content: start;
margin: 0;
}
.siteFooter .footerMenu li {
margin-left: 0;
margin-right: 40px;
}
}
@media screen and (min-width: 1200px){
.container {
max-width: 1200px;
} .header_scrolled .gMenu_outer .gMenu {
width: auto;
}
.device-pc .gMenu_outer {
display: flex;
align-items: center;
}
.device-pc .gMenu {
float: none;
}
.device-pc .gMenu>li>a {
margin: 0 13px;
padding: 10px 2px;
display: block;
overflow: hidden;
}
}
@media screen and (min-width: 1230px){
.container-fluid>.navbar-header,
.container>.navbar-header {
margin-left: -15px;
}
} @media (max-width: 1079.98px) {
.gMenu_outer {
display: none;
}
}
@media (min-width: 992px) {
body.device-pc .vk-mobile-nav-menu-btn,
body.device-pc .vk-mobile-nav {
display: block;
}
.siteHeader .container {
padding-top: 5px;
padding-bottom: 4px;
}
}
@media (min-width: 1080px) {
body.device-pc .vk-mobile-nav-menu-btn,
body.device-pc .vk-mobile-nav {
display: none;
}
.siteHeader .container {
padding-top: 16px;
padding-bottom: 14px;
}
}
 #hy_top p.text {
font-size: 18px;
font-weight: bold;
max-width: 90%;
margin: 0 auto 40px;
}
#hy_top #block01 {
margin: 0 auto;
padding: 0;
}
#hy_top #block01 .block01_video {
text-align: center;
}
#hy_top #block01 .block01_video video {
width: 100%;
}
#hy_top #block01 .block01_video .bg-red {
background: linear-gradient(90deg, #fff 0%, #fff 20%, #cc0000 20%, #cc0000 100%);
padding: 100px calc(50vw - 440px) 100px 0;
margin-right: calc(440px - 50vw);
}
#hy_top #block01 .block01_video .bg-gray {
background: #333;
padding: calc(3em + 10px) 10px 10px;
position: relative;
}
#hy_top #block01 .block01_video .bg-gray:before {
position: absolute;
content: "";
border-top: #fff solid 1px;
width: calc(100% - 20px);
top: 2em;
left: 10px;
}
#hy_top #block01 .block01_video .bg-gray:after { }
#hy_top #block01 .block01_video .bg-gray p {
display: inline-block;
padding: 0.5em;
margin: 0;
background: #333;
position: absolute;
top: 2em;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
line-height: 1.4em;
color: #fff;
}
#hy_top #block01 .block01_video .bg-gray p span {
white-space: nowrap;
display: inline-block;
}
#hy_top #block01 .block01_title {
text-align: center;
color: #cc0000;
}
#hy_top #block01 .block01_title_1 {
border-left: 4px solid #cc0000;
padding-left: 30px;
text-align: left;
}
.entry-body #hy_top .block01_title_1 h1 {
text-align: left;
margin-top: 100px;
font-size: 31px;
margin-bottom: 0.5em;
}
.entry-body #hy_top .block01_title_1 h2 {
margin-top: 0.5em;
line-height: 2em;
font-size: 15px;
}
.entry-body #hy_top .block01_title a.link_button {
width: 80%;
padding: 0.5em 1em;
}
#hy_top #block02 {
text-align: center;
}
#hy_top #block02 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_top #block02 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_top #block02 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_top #block02 ul li {
padding: 370px 0 0 0;
text-align: left;
}
#hy_top #block02 ul li:nth-child(1) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/3values_01.jpg) center top no-repeat;
background-size: 80%;
}
#hy_top #block02 ul li:nth-child(2) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/3values_02.jpg) center top no-repeat;
background-size: 80%;
}
#hy_top #block02 ul li:nth-child(3) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/3values_03.jpg) center top no-repeat;
background-size: 80%;
}
#hy_top #block02 ul li h3 {
color: #cc0000;
border-left: 4px solid #cc0000;
padding-left: 90px;
padding-bottom: 0;
margin: 0 auto;
width: 80%;
position: relative;
line-height: 80px;
}
#hy_top #block02 ul li h3 span {
color: #333;
font-size: 15px;
line-height: 1.3em;
position: absolute;
top: 100px;
left: 0;
}
#hy_top #block02 ul li:nth-child(1) h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/3values_01_s.gif) left center no-repeat;
line-height: 30px;
padding: 10px 0 10px 90px;
}
#hy_top #block02 ul li:nth-child(2) h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/3values_02_s.gif) left center no-repeat;
}
#hy_top #block02 ul li:nth-child(3) h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/3values_03_s.gif) left center no-repeat;
}
#hy_top #block02 ul li p {
margin: 5em auto 0;
width: 80%;
}
#hy_top #block03 {
text-align: center;
}
#hy_top #block03 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_top #block03 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_top #block03 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_top #block03 h3 {
margin-top: 1em;
margin-bottom: 0.5em;
}
#hy_top #block03 p {
margin-bottom: 1.5em;
}
#hy_top #block03 .assistant_l_01 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/assistant_l_01.jpg) right center no-repeat;
height: 21vw;
background-size: contain;
}
#hy_top #block03 .assistant_r_02 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/assistant_r_02.jpg) left center no-repeat;
height: 21vw;
background-size: contain;
}
#hy_top #block03 .illust_goriyou {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/illust_goriyou.gif) center top no-repeat;
height: 100vw;
max-height: 600px;
background-size: contain;
}
#hy_top #block04 {
padding-top: 0;
margin-bottom: 0;
text-align: center;
}
#hy_top #block04 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_top #block04 ul {
display: flex;
flex-wrap: wrap;
}
#hy_top #block04 ul li {
padding: 190px 0 0;
text-align: left;
height: 350px;
width: 20%;
}
#hy_top #block04 ul li:nth-child(1) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_01.png) center top no-repeat;
background-size: contain;
}
#hy_top #block04 ul li:nth-child(2) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_02.png) center top no-repeat;
background-size: contain;
}
#hy_top #block04 ul li:nth-child(3) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_03.png) center top no-repeat;
background-size: contain;
}
#hy_top #block04 ul li:nth-child(4) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_04.png) center top no-repeat;
background-size: contain;
}
#hy_top #block04 ul li:nth-child(5) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_05.png) center top no-repeat;
background-size: contain;
}
#hy_top #block04 ul li:nth-child(6) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_06.png) center top no-repeat;
background-size: 90%;
}
#hy_top #block04 ul li:nth-child(7) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_07.png) center top no-repeat;
background-size: 90%;
}
#hy_top #block04 ul li:nth-child(8) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_08.png) center top no-repeat;
background-size: 90%;
}
#hy_top #block04 ul li h3 {
line-height: 2.6em;
text-align: center;
height: 3em;
font-size: 18px;
color: #c60000;
font-weight: bold;
}
#hy_top #block04 ul li:last-child h3 {
line-height: 1.3em;
}
#hy_top #block04 ul li p {
text-align: center;
display: block;
margin: 0 auto;
width: 100%;
font-size: 12px;
line-height: 1.3em;
}
#hy_top #block05 {
text-align: center;
margin-top: 0;
padding-top: 0;
}
#hy_top #block05 h2 {
color: #fff;
background: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1em; font-weight: bold;
padding: 2em 0 1.6em;
}
#hy_top #block05 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_top #block05 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_top #block05 ul.slider {
background: #cc0000;
}
#hy_top #block05 ul.slider li img {
opacity: 0.6;
}
#hy_top #block05 ul.slider li.slick-current img {
opacity: 1;
}
#hy_top #block05 ul.slider_thumbnail,
#hy_top #block05 ul.slick-dots {
background: #cc0000;
padding: 10px calc(50vw - 470px);
display: flex !important;
position: static;
bottom: auto;
}
#hy_top #block05 ul.slider_thumbnail li {
}
#hy_top #block05 ul.slick-dots li {
width: auto;
height: auto;
}
#hy_top #block05 ul.slider_thumbnail li img,
#hy_top #block05 ul.slick-dots li img {
opacity: 0.6;
width: 90%;
margin: 0 5%;
}
#hy_top #block05 ul.slider_thumbnail li.slick-current img,
#hy_top #block05 ul.slick-dots li.slick-active img {
opacity: 1;
}
#hy_top #block05 .row {
padding: 15px 0;
border-bottom: #4472c4 solid 1px;
}
#hy_top #block05 .row:last-child {
border-bottom: none;
}
#hy_top #block05 .row > div {
display: flex;
flex-direction: column;
justify-content: center;
}
#hy_top #block05 h3 {
text-align: left;
padding: 15px;
}
#hy_top #block05 p {
text-align: left;
padding: 15px;
font-size: 20px;
line-height: 1.3;
}
#hy_top #block05 p span {
font-weight: bold;
}
#hy_top #block05 .link_button p {
padding: 0;
font-size: 22px;
line-height: 1.8em;
}
#hy_top #block06 {
text-align: center;
}
#hy_top #block06 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_top #block06 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_top #block06 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_top #block06 .block06_1,
#hy_top #block06 .block06_2 {
display: flex;
text-align: left;
}
#hy_top #block06 .block06_img {
text-align: left;
width: 50%;
}
#hy_top #block06 .block06_img img {
border: #c00 solid 5px;
}
#hy_top #block06 .block06_txt {
text-align: left;
width: 47%;
margin-left: 3%;
}
#hy_top #block06 .block06_1 h3,
#hy_top #block06 .block06_2 h3 {
font-size: 20px;
line-height: 1.2em;
margin: 0.5em 0;
border-bottom: #c00 dotted 1px;
}
#hy_top #block06 .block06_1 p.day,
#hy_top #block06 .block06_2 p.day {
font-size: 17px;
line-height: 1em;
margin-bottom: 0.5em;
}
#hy_top #block06 .block06_1 p.description,
#hy_top #block06 .block06_2 p.description {
line-height: 1.2em;
}
#hy_top #block06 .link_button {
width: 100%;
padding: 0.4em 2em;
}
#hy_top #block07 {
text-align: center;
background: #ececec;
}
#hy_top #block07 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_top #block07 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_top #block07 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_top #block07 ul {
margin: 0 auto;
text-align: center;
}
#hy_top #block07 ul li {
height: 58px;
margin: 0 11px;
display: inline-block;
}
#hy_top #block08 {
text-align: center;
}
#hy_top #block08 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_top #block08 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_top #block08 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_top #block08 ul {
margin: 0 auto;
text-align: center;
display: flex;
justify-content: space-between;
}
#hy_top #block08 li {
width: 30%;
background: #f9e5e6;
position: relative;
}
#hy_top #block08 li div {
margin: 15px;
}
#hy_top #block08 li div p.step {
display: inline-block;
font-size: 25px;
vertical-align: baseline;
line-height: 1em;
margin: 0;
width: 100%;
font-weight: bold;
color: #cc0000;
}
#hy_top #block08 li div p.step span {
font-size: 50px;
line-height: 1em;
}
#hy_top #block08 li div p.step span:before {
content: "\A";
white-space: pre;
}
#hy_top #block08 li div h3 {
display: inline-block;
font-size: 30px;
vertical-align: baseline;
padding: 0;
line-height: 1.2em;
margin: 0;
font-weight: bold;
color: #cc0000;
height: 2.4em;
}
#hy_top #block08 li:nth-child(2) div h3 {
line-height: 2.4em;
}
#hy_top #block08 li div p.description {
text-align: left;
padding-top: 110px;
margin-top: 30px;
}
#hy_top #block08 li:nth-child(1) div p.description {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/speed_01_sp.gif) center top no-repeat;
background-size: 60%;
}
#hy_top #block08 li:nth-child(2) div p.description {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/speed_02_sp.gif) center top no-repeat;
background-size: 70%;
}
#hy_top #block08 li:nth-child(3) div p.description {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/speed_03_sp.gif) center top no-repeat;
background-size: 45%;
}
#hy_top #block08 li:nth-child(1):after,
#hy_top #block08 li:nth-child(2):after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 20px 0 20px 20px;
border-color: transparent transparent transparent #cc0000;
position: absolute;
top: calc(50% - 16px);
right: -13%;
}
#hy_top #block08 .link_button {
margin-top: 60px;
}
#hy_top #block09 {
text-align: center;
}
#hy_top #block09 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_top #block09 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_top #block09 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_top #block09 p.text {
margin-bottom: 0;
}
#hy_top #block09 ul {
margin: 0 auto;
text-align: center;
letter-spacing: -0.4em;
}
#hy_top #block09 ul li {
width: 25%;
display: inline-block;
}
#hy_top #block10 ul li img {
max-width: 80%;
}
#hy_top #block10 {
text-align: center;
}
#hy_top #block10 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_top #block10 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_top #block10 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_top #block10 ul {
margin: 0 auto;
text-align: center;
display: flex;
flex-wrap: wrap;
}
#hy_top #block10 ul li {
width: 20%;
height: 100px;
}
#hy_top #block10 ul li img {
max-width: 80%;
} #hy_about .block01_1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/01_map.png) center bottom no-repeat;
background-size: calc(100% - 30px);
height: 1070px;
margin-bottom: 75px;
}
#hy_about .block01_1 .block01_1_1 {
border-left: 4px solid #cc0000;
padding-left: 38px;
text-align: left;
margin-left: 15px;
}
#hy_about .block01_1 .block01_1_1 h2 {
font-size: 27px;
color: #cc0000;
margin: 0.5em 0;
line-height: 1.2em;
}
#hy_about .block01_1 .block01_1_1 h2 span {
font-size: 20px;
line-height: 1.3em;
}
#hy_about .block01_1 .block01_1_1 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_about .block01_1 .block01_1_1 p {
font-size: 15px;
}
#hy_about .block01_1 .block01_1_1 p:first-child {
font-size: 60px;
color: #cc0000;
line-height: 1em;
margin-bottom: 0;
}
#hy_about p.text {
font-size: 18px;
font-weight: bold;
max-width: 90%;
margin: 0 auto 40px;
}
#hy_about .block01_2 {
margin-bottom: 75px;
}
#hy_about .block01_2 h3 {
color: #fff;
background: #cc0000;
font-size: 28px;
margin-bottom: 2em;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
}
#hy_about h3.sec_ttl {
color: #fff!important;
background: #cc0000;
font-size: 28px;
margin-bottom: 2em;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
}
#hy_about .block01_2 .block01_2_1 {
display: flex;
justify-content: space-between;
}
#hy_about .block01_2 .block01_2_1 div {
color: #000;
background: #ebe3de;
padding: 25px 15px 10px;
font-size: 14px;
width: 15%;
position: relative;
}
#hy_about .block01_2 .block01_2_1 div.process_item {
width: 18%;
}
#hy_about .block01_2 .block01_2_1 div:first-child {
background: #f9e5e6;
display: flex;
flex-direction: column;
justify-content: center;
}
#hy_about .block01_2 .block01_2_1 div.process_item:first-child {
background: #ebe3de;
display: block;
}
#hy_about .block01_2 .block01_2_1 div:last-child {
background: #f9e5e6;
display: flex;
flex-direction: column;
justify-content: center;
}
#hy_about .block01_2 .block01_2_1 div:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 12px 0 12px 12px;
border-color: transparent transparent transparent #cc0000;
position: absolute;
top: calc(50% - 12px);
right: -12%;
}
#hy_about .block01_2 .block01_2_1 div:last-child:after {
border: none;
}
#hy_about .block01_2 h4 {
color: #cc0000;
background: none;
font-size: 19px;
margin-bottom: 1em;
text-align: center;
}
#hy_about .block01_2 .block01_2_1 div:first-child h4 {
font-size: 21px;
margin: 0;
}
#hy_about .block01_2 .block01_2_1 div.process_item:first-child h4 {
margin-bottom: 1em;
font-size: 19px;
}
#hy_about .block01_2 .block01_2_1 div:last-child h4 {
font-size: 26px;
margin: 0;
}
#hy_about .block01_2 .block01_2_2 {
text-align: center;
margin-top: 1em;
}
#hy_about .block01_3 h3 {
color: #fff;
background: #cc0000;
font-size: 28px;
margin-bottom: 5em;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
}
#hy_about .block01_3 .block01_3_1 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-content: stretch;
}
#hy_about .block01_3 .block01_3_1 div {
width: 48%;
margin-bottom: 150px;
background: #f9e5e6;
padding: 15px;
}
#hy_about .block01_3 .block01_3_1 div:nth-child(3),
#hy_about .block01_3 .block01_3_1 div:nth-child(4) {
margin-bottom: 0;
}
#hy_about .block01_3 .block01_3_1 div h4 {
color: #cc0000;
font-size: 19px;
margin-bottom: 1em;
text-align: center;
padding-top: 130px;
margin-top: -115px;
}
#hy_about .block01_3 .block01_3_1 .block01_3_1_1 h4 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/member_a.png) center top no-repeat;
background-size: 100px;
}
#hy_about .block01_3 .block01_3_1 .block01_3_1_2 h4 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/member_b.png) center top no-repeat;
background-size: 100px;
}
#hy_about .block01_3 .block01_3_1 .block01_3_1_3 h4 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/member_c.png) center top no-repeat;
background-size: 100px;
}
#hy_about .block01_3 .block01_3_1 .block01_3_1_4 h4 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/member_d.png) center top no-repeat;
background-size: 100px;
}
#hy_about .block01_3 .block01_3_1 div span {
font-size: 19px;
}
#hy_about .block01_3 .block01_3_1 div .previous_job {
background-color: #cc0000;
color: #fff;
padding: 0.3em 1em;
font-size: 14px;
display: inline-block;
margin-bottom: 2em;
}
#hy_about .block02_1 {
margin-bottom: 75px;
}
#hy_about .block02_1 .block02_1_2 {
border-left: 4px solid #cc0000;
padding-left: 38px;
text-align: left;
}
#hy_about .block02_1 .block02_1_2 h2 {
font-size: 27px;
color: #cc0000;
margin: 0.5em 0;
line-height: 1.2em;
}
#hy_about .block02_1 .block02_1_2 h2 span {
font-size: 20px;
line-height: 1.3em;
}
#hy_about .block02_1 .block02_1_2 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_about .block02_1 .block02_1_2 p {
font-size: 15px;
}
#hy_about .block02_1 .block02_1_2 p:first-child {
font-size: 60px;
color: #cc0000;
line-height: 1em;
margin-bottom: 0;
}
#hy_about .block02_1 .bg-red {
background: linear-gradient(90deg, #cc0000 0%, #cc0000 80%, #fff 80%, #fff 100%);
padding: 100px 0 100px calc(50vw - 440px);
margin-left: calc(440px - 50vw);
}
#hy_about .block02_2 {
margin-bottom: 100px;
}
#hy_about .block02_2 h3 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_about .block02_2 h3 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_about .block02_2 h3 span:before {
content: "\A";
white-space: pre;
}
#hy_about .block02_2 .block02_2_1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/illust_jyoucyousei.gif) center top no-repeat;
background-size: calc(100% - 30px);
height: 1110px;
}
#hy_about .block02_3 {
margin-bottom: 100px;
}
#hy_about .block02_3 h3 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_about .block02_3 h3 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_about .block02_3 h3 span:before {
content: "\A";
white-space: pre;
}
#hy_about .block02_3 .block02_3_1 th {
border: solid 4px #cc0000;
text-align: center;
background: #f9e5e6;
font-size: 20px;
font-weight: bold;
}
#hy_about .block02_3 .block02_3_1 td {
border: solid 4px #cc0000;
text-align: center;
font-size: 15px;
}
#hy_about .block02_3 .block02_3_1 tr:first-child td {
background: #efbcbc;
}
#hy_about .block02_3 .block02_3_1 td span {
font-size: 50px;
line-height: 1em;
color: #cc0000;
}
#hy_about .block02_3 .block02_3_1 td span:after {
content: "\A";
white-space: pre;
}
#hy_about .block02_4 h3 {
color: #fff;
background: #cc0000;
font-size: 28px;
margin-bottom: 2em;
padding: 0.7em 3em 0.7em calc(50vw - 470px);
display: inline-block;
line-height: 1.3em;
}
#hy_about .block02_4 .block02_4_1 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-content: stretch;
}
#hy_about .block02_4 .block02_4_1 > div {
width: 48%;
text-align: center;
border: #cc0000 solid 4px;
}
#hy_about .block02_4 .block02_4_1 > div h4 {
background: none;
color: #cc0000;
margin: 1em auto;
font-weight: bold;
}
#hy_about .block02_4 .block02_4_1 > div li {
background: #cc0000;
color: #fff;
padding: 0.5em 1em;
width: 330px;
margin: 25px auto;
font-size: 20px;
}
#hy_about .block02_4 .block02_4_1 .block02_4_1_1 li:nth-child(1) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/img_skillup.jpg) center top no-repeat;
background-size: contain;
height: 476px;
text-indent: -9999px;
margin-bottom: 40px;
}
#hy_about .block02_4 .block02_4_1 .block02_4_1_2 li:nth-child(1) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/img_feedback.jpg) center top no-repeat;
background-size: contain;
height: 476px;
text-indent: -9999px;
margin-bottom: 40px;
}
#hy_about .block02_4 .block02_4_1 .block02_4_1_1 li:last-child,
#hy_about .block02_4 .block02_4_1 .block02_4_1_2 li:last-child {
margin-bottom: 40px;
}
#hy_about .block03_1 {
margin-bottom: 75px;
}
#hy_about .block03_1 .block03_1_1 {
border-left: 4px solid #cc0000;
padding-left: 38px;
text-align: left;
}
#hy_about .block03_1 .block03_1_1 h2 {
font-size: 27px;
color: #cc0000;
margin: 0.5em 0;
line-height: 1.2em;
}
#hy_about .block03_1 .block03_1_1 h2 span {
font-size: 20px;
line-height: 1.3em;
}
#hy_about .block03_1 .block03_1_1 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_about .block03_1 .block03_1_1 p {
font-size: 15px;
}
#hy_about .block03_1 .block03_1_1 p:first-child {
font-size: 60px;
color: #cc0000;
line-height: 1em;
margin-bottom: 0;
}
#hy_about .block03_1 .bg-red {
background: linear-gradient(90deg, #fff 0%, #fff 20%, #cc0000 20%, #cc0000 100%);
padding: 100px calc(50vw - 440px) 100px 0;
margin-right: calc(440px - 50vw);
}
#hy_about .block03_2 h3 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_about .block03_2 h3 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_about .block03_2 h3 span:before {
content: "\A";
white-space: pre;
}
#hy_about .block03_2 p {
text-align: center;
}
#hy_about .block03_2 h4 {
color: #fff;
background: #cc0000;
font-size: 28px;
margin-bottom: 2em;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
border-radius: 0;
line-height: 1em;
}
#hy_about .block03_2 .block03_2_1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/flow.gif) center top no-repeat;
background-size: calc(100% - 30px);
height: 295px;
text-indent: -9999px;
margin-bottom: 75px;
}
#hy_about .block03_2 .block03_2_2 {
display: flex;
justify-content: space-between;
margin-bottom: 75px;
}
#hy_about .block03_2 .block03_2_2 > div:first-child {
width: 70%;
}
#hy_about .block03_2 .block03_2_2 p {
background: #f9e5e6;
text-align: left;
margin: 0;
font-size: 16px;
padding: 1em;
position: relative;
}
#hy_about .block03_2 .block03_2_2 p span {
display: block;
text-align: right;
font-weight: bold;
font-size: 14px;
margin-top: 1em;
}
#hy_about .block03_2 .block03_2_2 p:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 10px 0 10px 20px;
border-color: transparent transparent transparent #f9e5e6;
position: absolute;
top: calc(50% - 16px);
right: -20px;
}
#hy_about .block03_2 .block03_2_2 > div:nth-child(2) {
width: 30%;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/hirashimasan_sp.jpg) center no-repeat;
background-size: contain;
text-indent: -9999px;
}
#hy_about .block03_2 .block03_2_3 h5 {
color: #cc0000;
font-size: 24px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_about .block03_2 .block03_2_3 .block03_2_3_1 {
display: flex;
justify-content: space-between;
}
#hy_about .block03_2 .block03_2_3 .block03_2_3_1 > div {
width: 30%;
}
#hy_about .block03_2 .block03_2_3 .block03_2_3_1 > div > div {
border: #c00 2px solid;
height: 100%;
padding: 1em;
}
#hy_about .block03_2 .block03_2_3 h6 {
color: #cc0000;
font-size: 20px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_about .block03_2 .block03_2_3 p {
text-align: left;
}
#hy_about .block03_2 .block03_2_3 .block03_2_3_1 a.link_button {
padding: 0.7em 1em;
}
#hy_about #block04 {
text-align: center;
margin-top: 0;
padding-top: 0;
}
#hy_about #block04 h2 {
color: #fff;
background: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1em;
margin-bottom: 0;
font-weight: bold;
padding: 2em 0 1.6em;
}
#hy_about #block04 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_about #block04 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_about #block04 ul.slider {
background: #cc0000;
}
#hy_about #block04 ul.slider li img {
opacity: 0.6;
}
#hy_about #block04 ul.slider li.slick-current img {
opacity: 1;
}
#hy_about #block04 ul.slider_thumbnail,
#hy_about #block04 ul.slick-dots {
background: #cc0000;
padding: 10px calc(50vw - 470px);
display: flex !important;
position: static;
bottom: auto;
}
#hy_about #block04 ul.slider_thumbnail li {
}
#hy_about #block04 ul.slick-dots li {
width: auto;
height: auto;
}
#hy_about #block04 ul.slider_thumbnail li img,
#hy_about #block04 ul.slick-dots li img {
opacity: 0.6;
width: 90%;
margin: 0 5%;
}
#hy_about #block04 ul.slider_thumbnail li.slick-current img,
#hy_about #block04 ul.slick-dots li.slick-active img {
opacity: 1;
}
#hy_about #block_strength{
margin-bottom: 75px;
}
#hy_about #block_strength .strength_list{
margin-top: 40px;
}
#hy_about #block_strength .strength_list_item_wrapper{
margin-bottom: 40px;
}
#hy_about #block_strength .strength_list_item{
background: rgba(235,227,222,0.3);
position: relative;
padding: 30px 15px 15px;
height: 100%;
}
#hy_about #block_strength .strength_list_item .number{
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto;
width: 40px;
height: 40px;
background: #cc0000;
color: #fff;
font-weight: bold;
font-size: 24px;
line-height: 1;
border-radius: 50%;
margin-bottom: 0.7em;
position: absolute;
top: -20px;
left: calc(50% - 20px);
}
#hy_about #block_strength .strength_list_item h3{
color: #cc0000;
line-height: 1.5;
font-weight: bold;
font-size: 1.4rem;
margin-bottom: 0.3em;
} .page-id-8197 .siteContent {
padding: 0 0 3.5em;
margin-top: 0 !important;
}
.page-id-8197 .siteHeader {
background: rgba(203, 0, 0, 0.8);
}
.page-id-8197 .container > .navbar-header {
display: none;
}
.page-id-8197 ul.gMenu a {
background: none;
color: #fff;
}
.page-id-8197 ul.gMenu > li:nth-child(7) > a {
padding: 10px 0;
line-height: 1.65em;
}
.page-id-8197 ul.gMenu > li:last-child > a {
border: none;
border-radius: 10px;
background: #fff;
padding: 6px 11px;
color: #555;
margin-right: 0;
margin-left: 50px;
width: 200px;
height: 60px;
display: flex;
justify-content: center;
align-items: center;
}
#hy_top_2019 h2 {
color: #000;
font-size: 44px;
text-align: center;
}
#hy_top_2019 > div:nth-child(odd) {
background: #f9f9f9;
}
#hy_top_2019 #block01 {
background: #cb0000 url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/mv.png) left 50vw bottom 270px no-repeat;
padding-top: 180px;
background-size: auto 100%;
position: relative;
margin-bottom: 0;
}
#hy_top_2019 #block01 h1 { background: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/hy_logo2.png) no-repeat;
background-size: contain; width: 350px;
max-width: 100%;
height: 60px;
text-indent: -9999px;
}
#hy_top_2019 #block01 h2 {
color: #fff;
font-size: 34px;
text-align: left;
}
#hy_top_2019 #block01 p {
color: #fff;
font-size: 22px;
text-shadow: 0 0 5px rgba(0, 0, 0, 0.9);
}
#hy_top_2019 #block01 a.mv_link_button {
background: #fff;
display: flex;
align-items: center;
padding: 0 40px 0 40px;
position: absolute;
bottom: 50px;
left: 53%;
border-radius: 20px 20px;
height: 80px;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
}
#hy_top_2019 #block01 a.mv_link_button:hover {
text-decoration: none;
box-shadow: -10px 20px 5px rgba(0, 0, 0, 0.3);
}
#hy_top_2019 #block01 a.mv_link_button p {
color: #555;
margin: 0;
font-size: 30px;
text-shadow: none;
width: 12.5em;
line-height: 1em;
}
#hy_top_2019 #block01 a.mv_link_button p span {
font-size: 0.7em;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/mv_contact.png) left center no-repeat;
background-size: contain;
padding-left: 1.5em;
}
#hy_top_2019 #block01 a.mv_link_button2 {
background: #fff;
display: flex;
align-items: center;
padding: 0 40px 0 40px;
position: absolute;
bottom: 150px;
left: 53%;
border-radius: 20px 20px;
height: 80px;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
}
#hy_top_2019 #block01 a.mv_link_button2:hover {
text-decoration: none;
box-shadow: -10px 20px 5px rgba(0, 0, 0, 0.3);
}
#hy_top_2019 #block01 a.mv_link_button2 p {
color: #555;
margin: 0;
font-size: 30px;
text-shadow: none;
width: 12.5em;
}
#hy_top_2019 #block02 ul {
display: flex;
flex-wrap: wrap;
}
#hy_top_2019 #block02 {
}
#hy_top_2019 #block02 ul li {
padding: 190px 0 0;
text-align: left; width: 20%;
background-size: contain;
background-position: center top;
background-repeat: no-repeat;
}
#hy_top_2019 #block02 ul li:nth-child(1) {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/2_1.png);
}
#hy_top_2019 #block02 ul li:nth-child(2) {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/2_2.png);
}
#hy_top_2019 #block02 ul li:nth-child(3) {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/2_4.png);
}
#hy_top_2019 #block02 ul li:nth-child(4) {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/2_5.png);
}
#hy_top_2019 #block02 ul li:nth-child(5) {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/2_6.png);
}
#hy_top_2019 #block02 ul li h3 {
line-height: 2.6em;
text-align: center;
height: 3em;
font-size: 24px;
color: #cb0000;
font-weight: bold;
}
#hy_top_2019 #block02 ul li:nth-child(4) h3,
#hy_top_2019 #block02 ul li:nth-child(5) h3 {
line-height: 1.3em;
}
#hy_top_2019 #block02 ul li p {
text-align: center;
display: block;
margin: 0 auto;
width: 100%;
font-size: 12px;
line-height: 1.3em;
}
#hy_top_2019 #block03 ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#hy_top_2019 #block03 ul li {
padding: 55px 25px 25px;
text-align: left;
width: calc((100% - 80px) / 3);
background: #cb0000;
border-radius: 15px;
position: relative;
}
#hy_top_2019 #block03 ul li:before {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 50px 0 50px 55px;
border-color: transparent transparent transparent #fff;
position: absolute;
top: 50%;
right: -55px;
z-index: 1;
transform: translateY(-50%);
}
#hy_top_2019 #block03 ul li:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 50px 0 50px 55px;
border-color: transparent transparent transparent #cb0000;
position: absolute;
top: 50%;
right: -48px;
z-index: 1;
transform: translateY(-50%);
}
#hy_top_2019 #block03 ul li:last-child:before,
#hy_top_2019 #block03 ul li:last-child:after {
content: none;
}
#hy_top_2019 #block03 ul li p.step {
text-indent: -9999px;
width: 71px;
height: 43px;
background-position: center;
background-repeat: no-repeat;
position: absolute;
z-index: 1;
top: 32px;
left: 50%;
transform: translateX(-50%);
}
#hy_top_2019 #block03 ul li:nth-child(1) p.step {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/3_1_1.png);
}
#hy_top_2019 #block03 ul li:nth-child(2) p.step {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/3_2_1.png);
}
#hy_top_2019 #block03 ul li:nth-child(3) p.step {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/3_3_1.png);
}
#hy_top_2019 #block03 ul li h3 {
text-align: center;
color: #fff;
font-size: 28px;
background-position: center bottom 40px;
background-color: #a20000;
background-repeat: no-repeat;
height: 250px;
padding: 40px 0;
margin-bottom: 15px;
}
#hy_top_2019 #block03 ul li:nth-child(1) h3 {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/3_1_2.png);
background-position: center bottom 25px;
}
#hy_top_2019 #block03 ul li:nth-child(2) h3 {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/3_2_2.png);
}
#hy_top_2019 #block03 ul li:nth-child(3) h3 {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/3_3_2.png);
}
#hy_top_2019 #block03 ul li p {
color: #fff;
font-size: 14px;
}
#hy_top_2019 #block04 h2 { }
#hy_top_2019 #block04 ul {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
#hy_top_2019 #block04 ul li {
padding: 0; width: calc((100% - 40px) / 2);
border-radius: 15px;
position: relative;
border: solid 10px;
text-align: center;
margin: 0;
}
#hy_top_2019 #block04 ul li:first-child {
border-color: #28abe5;
}
#hy_top_2019 #block04 ul li:last-child {
border-color: #c12c1f;
}
#hy_top_2019 #block04 ul li .block04_1_2 {
background: #28abe5;
color: #fff;
height: 160px;
margin-bottom: 60px;
position: relative;
}
#hy_top_2019 #block04 ul li .block04_2_2 {
background: #c12c1f;
color: #fff;
height: 160px;
margin-bottom: 60px;
position: relative;
}
#hy_top_2019 #block04 ul li .block04_1_2:after,
#hy_top_2019 #block04 ul li .block04_2_2:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 30px 130px 0 130px;
position: absolute;
left: 50%;
bottom: 0;
transform: translate(-50%, 100%);
}
#hy_top_2019 #block04 ul li .block04_1_2:after {
border-color: #28abe5 transparent transparent transparent;
}
#hy_top_2019 #block04 ul li .block04_2_2:after {
border-color: #c12c1f transparent transparent transparent;
}
#hy_top_2019 #block04 ul li:first-child h3,
#hy_top_2019 #block04 ul li:last-child h3 {
width: 100%;
height: 50px;
text-indent: -9999px;
}
#hy_top_2019 #block04 ul li:first-child h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/4_standard.png) no-repeat;
background-position: center bottom;
}
#hy_top_2019 #block04 ul li:last-child h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/4_customize.png) no-repeat;
background-position: center bottom;
}
#hy_top_2019 #block04 ul li,
#hy_top_2019 #block04 ul li.block04_8:last-child {
border-color: #28abe5;
}
#hy_top_2019 #block04 ul li.block04_7 {
border-color: #c12c1f;
position: relative;
}
#hy_top_2019 #block04 ul li.block04_7:after {
display: none;
content: "";
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, -120%);
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/block04_7.png) no-repeat;
width: 153px; height: 48px;
}
#hy_top_2019 #block04 ul li .block04_6_2,
#hy_top_2019 #block04 ul li .block04_8_2 {
background: #28abe5;
color: #fff;
height: 120px;
}
#hy_top_2019 #block04 ul li .block04_7_2 {
background: #c12c1f;
color: #fff;
height: 120px;
}
#hy_top_2019 #block04 .block04_9 {
padding: 15px;
border-radius: 15px;
position: relative;
border: solid 10px;
text-align: left;
margin: 0;
border-color: #28abe5;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
#hy_top_2019 #block04 .block04_9:before {
content: "";
position: absolute;
top: 50%;
left: 0;
transform: translate(-30px, -50%);
background: #fff;
width: 50px;
height: 100px;
}
#hy_top_2019 #block04 .block04_9:after {
content: "";
position: absolute;
top: 50%;
left: 0;
transform: translate(-30px, -50%);
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/block04_9.png) center no-repeat;
width: 50px;
height: 50px;
}
#hy_top_2019 #block04 .block04_9_2 {
color: #28abe5;
background: #d4eefa;
width: 80%;
padding: 10px 10% 0;
}
#hy_top_2019 #block04 .block04_10 p {
color: #c12c1f;
text-align: center;
font-weight: bold;
margin-top: 50px;
margin-bottom: 0;
}
#hy_top_2019 #block04 ul li.block04_11 {
border-color: #c12c1f;
position: relative;
}
#hy_top_2019 #block04 ul li .block04_11_2 {
background: #c12c1f;
color: #fff; }
#hy_top_2019 #block04 ul li.block04_11:after {
content: none;
position: absolute;
top: 0;
left: 0;
transform: translate(-40%, -80%);
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/202009_campaign.png) center no-repeat;
background-size: contain;
width: 400px;
height: 200px;
} #hy_top_2019 #block04 .block04_title {
font-size: 18px;
margin-bottom: 0;
font-weight: bold;
}
#hy_top_2019 #block04 .block04_title span {
display: inline-block;
}
#hy_top_2019 #block04 .block04_9 .block04_title {
width: 20%;
text-align: center;
}
#hy_top_2019 #block04 .price {
padding: 10px;
margin: 0;
}
#hy_top_2019 #block04 .price1 {
font-size: 60px;
line-height: 60px;
font-weight: bold;
}
#hy_top_2019 #block04 .price2 {
font-size: 24px;
font-weight: bold;
}
#hy_top_2019 #block04 .price3 {
font-size: 24px;
margin-bottom: 20px;
vertical-align: bottom;
display: inline-block;
font-weight: bold;
}
#hy_top_2019 #block04 .price4 {
font-size: 12px;
margin-left: -20px;
}
#hy_top_2019 #block04 .price5 {
font-size: 36px;
line-height: 70px;
font-weight: bold;
}
#hy_top_2019 #block04 .time,
#hy_top_2019 #block04 .block04_9 .price {
padding: 10px;
margin: 0;
color: #28abe5;
background: #d4eefa;
}
#hy_top_2019 #block04 .block04_9 .price {
display: inline-block;
vertical-align: middle;
padding: 0 10px;
}
#hy_top_2019 #block04 li.block04_7 .time {
background: #f3d5d2;
color: #c12c1f;
}
#hy_top_2019 #block04 .time1,
#hy_top_2019 #block04 .block04_9 .price1 {
font-size: 48px;
line-height: 60px;
font-weight: bold;
}
#hy_top_2019 #block04 .time2,
#hy_top_2019 #block04 .block04_9 .price2 {
font-size: 24px;
font-weight: bold;
}
#hy_top_2019 #block04 .time3,
#hy_top_2019 #block04 .block04_9 .price3 {
font-size: 24px;
margin-bottom: 20px;
vertical-align: bottom;
display: inline-block;
font-weight: bold;
}
#hy_top_2019 #block04 .block04_9 a {
background: #28abe5;
color: #fff;
line-height: 2em;
border-radius: 1.5em;
display: inline-block;
vertical-align: middle;
padding: 0 0.5em 0 1em;
}
#hy_top_2019 #block04 .block04_9 a span {
background: #fff;
color: #28abe5;
border-radius: 50%;
display: inline-block;
vertical-align: middle;
width: 1.2em;
height: 1.2em;
text-align: center;
line-height: 1.2em;
margin-left: 0.8em;
}
#hy_top_2019 #block04 .description {
font-size: 16px;
margin-bottom: 0;
line-height: 2em;
padding: 1em 0;
color: #555;
}
#hy_top_2019 #block04 ul li .block04_2_2 .price {
font-size: 32px;
line-height: 60px;
}
#hy_top_2019 .block04_3 {
margin-top: 25px;
color: #c12c1f;
font-weight: bold;
text-align: center;
}
#hy_top_2019 #block04 .link_button {
padding: 0.3em 1em;
border: 3px solid #f60;
border-radius: 2em;
background: #f60; position: relative;
display: block;
text-align: center;
margin: 1em auto;
color: #fff;
transition: 0.3s;
width: 480px;
font-size: 30px;
}
#hy_top_2019 #block04 .link_button:hover {
background: rgba(255, 102, 0, 0.8); }
#hy_top_2019 #block04 .link_button p {
margin: 0 auto;
text-align: center;
position: relative;
display: inline-block;
font-weight: normal;
}
#hy_top_2019 #block04 .link_button p:after {
content: none;
}
#hy_top_2019 #block04 .su-spoiler {
text-align: center;
}
#hy_top_2019 #block04 .su-spoiler-style-default > .su-spoiler-title {
display: inline-block;
font-weight: normal;
color: #444;
}
#hy_top_2019 #block04 li.block04_7 .duration {
background: #f3d5d2;
color: #c12c1f;
font-size: 18px;
font-weight: bold;
padding: 0 0 10px 0;
position: relative;
margin-bottom: 0;
}
#hy_top_2019 #block04 li.block04_6 .duration,
#hy_top_2019 #block04 li.block04_8 .duration {
color: #28abe5;
background: #d4eefa;
font-size: 18px;
font-weight: bold;
padding: 0 0 10px 0;
position: relative;
margin-bottom: 0;
}
#hy_top_2019 #block04 li.block04_6 .duration span,
#hy_top_2019 #block04 li.block04_7 .duration span,
#hy_top_2019 #block04 li.block04_8 .duration span {
font-size: 30px;
}
#hy_top_2019 #block04 li.block04_6 .duration:before,
#hy_top_2019 #block04 li.block04_7 .duration:before,
#hy_top_2019 #block04 li.block04_8 .duration:before {
content: "";
position: absolute;
display: block;
width: 70%;
height: 5px;
background: #fff;
top: -10px;
left: 15%;
}
#hy_top_2019 #block04 .block04_9 .filter {
width: calc(100% + 50px);
height: calc(100% + 20px);
background-color: rgba(255, 255, 255, 0.6);
position: absolute;
left: -30px;
z-index: 10;
}
#hy_top_2019 #block04 .block04_9 a {
pointer-events: none;
}
#hy_top_2019 #block04 .block04_9 .filter:after {
content: "";
height: 100px;
width: 283px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/renewal_area_1019.png) center no-repeat;
background-size: contain;
position: absolute;
top: -30px;
left: 0;
z-index: 10;
}
.su-spoiler-icon-plus.su-spoiler-closed .su-spoiler-icon {
border-radius: 50%;
border: #444 solid 1px;
color: #444;
}
#hy_top_2019 #block04 .su-spoiler-style-default > .su-spoiler-content {
padding: 1em 0;
text-align: left;
}
#hy_top_2019 #block05 h3 {
font-size: 22px;
text-align: center;
margin-bottom: 30px;
}
#hy_top_2019 #block05 a {
position: relative;
display: block;
}
#hy_top_2019 #block05 li a:hover {
opacity: 0.8;
}
#hy_top_2019 #block05 a img {
border-radius: 10px;
}
#hy_top_2019 #block05 a div {
position: absolute;
bottom: 0;
left: 0;
background: #c00;
color: #fff;
width: 100%;
border-radius: 0 0 10px 10px;
font-size: 24px;
padding: 10px;
}
#hy_top_2019 #block05 a div p {
line-height: 1.2;
margin-bottom: 0;
}
#hy_top_2019 #block05 a div .name {
font-size: 14px;
margin-bottom: 0.5em;
}
#hy_top_2019 #block05 .block05_1 a {
background: none;
border-radius: 10px;
}
#hy_top_2019 #block05 .block05_1 a p {
font-weight: normal;
line-height: 1em;
margin-right: 1.5em;
}
#hy_top_2019 #block05 .block05_1 a.link_button p:before {
content: "";
display: inline-block;
position: absolute;
top: 50%;
vertical-align: middle;
right: -50px;
width: 30px;
height: 30px;
border: 2px solid #c00;
border-radius: 50%;
transform: translateY(-50%);
}
#hy_top_2019 #block05 .block05_1 a.link_button p:after {
content: "";
display: inline-block;
position: absolute;
top: calc(50% - 5px);
vertical-align: middle;
right: -38px;
width: 10px;
height: 10px;
border: none;
border-right: 2px solid #c00;
border-bottom: 2px solid #c00;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
#hy_top_2019 #block05 .block05_1 a:hover {
background: #c00;
}
#hy_top_2019 #block05 .block05_1 a.link_button:hover p:before {
border: 2px solid #fff;
}
#hy_top_2019 #block05 .block05_1 a.link_button:hover p:after {
border-right: 2px solid #fff;
border-bottom: 2px solid #fff;
}
#hy_top_2019 #block06 {
}
#hy_top_2019 #block06 .block06_1 {
background: #aeddf2;
padding: 70px 50px 50px;
border-radius: 10px;
}
#hy_top_2019 #block06 .block06_1 h3 {
background: #c00 url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/6_bg.png) no-repeat;
background-position: center bottom;
background-size: contain;
padding: 40px 0 135px;
text-align: center;
color: #fff;
border-radius: 10px 10px 0 0;
}
#hy_top_2019 #block06 .block06_1 ul {
display: flex;
justify-content: space-between;
margin: -10px -15px 0;
}
#hy_top_2019 #block06 .block06_1 li {
background: #a20000;
padding: 35px 0;
z-index: 10;
width: calc((100% - 100px) / 3);
text-align: center;
color: #fff;
font-size: 20px;
position: relative;
}
#hy_top_2019 #block06 .block06_1 li:before {
content: "";
width: 35px;
height: 49px;
background-position: center bottom;
background-size: contain;
background-repeat: no-repeat;
display: block;
position: absolute;
top: -20px;
left: 10px;
}
#hy_top_2019 #block06 .block06_1 li:nth-child(1):before {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/6_1.png);
}
#hy_top_2019 #block06 .block06_1 li:nth-child(2):before {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/6_2.png);
}
#hy_top_2019 #block06 .block06_1 li:nth-child(3):before {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/6_3.png);
}
#hy_top_2019 #block07 {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/7_bg.png);
background-size: cover;
margin-top: 0;
}
#hy_top_2019 #block07 ul {
display: flex;
justify-content: space-between;
}
#hy_top_2019 #block07 li {
text-align: center;
background: rgba(255, 255, 255, 0.8);
width: calc(50% - 25px);
padding: 0 20px;
}
#hy_top_2019 #block07 li h3 {
font-size: 44px;
margin: -20px auto 30px;
color: #c00;
}
#hy_top_2019 #block07 li p {
font-size: 15px;
}
#hy_top_2019 #block08 p {
font-size: 24px;
text-align: center;
}
#hy_top_2019 #block08 .block08_1 {
margin-bottom: 30px;
}
#hy_top_2019 #block08 .block08_1 li {
text-align: center;
}
#hy_top_2019 #block08 .block08_1 li img {
border-radius: 10px;
}
#hy_top_2019 #block08 .block08_2 {
display: flex;
flex-wrap: wrap;
}
#hy_top_2019 #block08 .block08_2 li {
margin-bottom: 30px;
}
#hy_top_2019 #block08 .block08_2 li > div {
border: 5px solid #cc0000;
border-radius: 10px;
height: 100%;
}
#hy_top_2019 #block08 .block08_2 li > div h3 {
background: #c00;
color: #fff;
font-size: 20px;
padding: 15px;
}
#hy_top_2019 #block08 .block08_2 li > div p {
color: #c00;
font-size: 16px;
text-align: left;
padding: 0 15px;
}
#hy_top_2019 #block08 .block08_2 li > div p.ttl {
margin-top: 1em;
}
#hy_top_2019 #block08 .block08_2 li > div p.ttl span {
padding: 0 1em;
margin-right: 1em;
display: inline-block;
border: 2px solid #cc0000;
}
#hy_top_2019 #block08 .link_button {
padding: 0.3em 1em;
border: 3px solid #cc0000;
border-radius: 2em;
background: #c00;
position: relative;
display: block;
text-align: center;
margin: 1em auto;
color: #fff;
transition: 0.3s;
width: 480px;
font-size: 30px;
}
#hy_top_2019 #block08 .link_button:hover {
background: rgba(204, 0, 0, 0.8);
}
#hy_top_2019 #block08 .link_button p {
margin: 0 auto;
text-align: center;
position: relative;
display: inline-block;
font-weight: normal;
}
#hy_top_2019 #block08 .link_button p:after {
content: none;
}
.mainSection #hy_top_2019 #block09 .postList {
height: 500px;
overflow-y: scroll;
}
.mainSection #hy_top_2019 #block09 .postList h1 {
text-align: left;
}
#hy_top_2019 #block10 {
margin-top: 0;
}
#hy_top_2019 #block10 h3 {
font-size: 24px;
text-align: center;
line-height: 1.8em;
margin-bottom: 1.2em;
}
#hy_top_2019 #block10 .illust_goriyou {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/illust_goriyou.gif) center top no-repeat;
height: 50vw;
max-height: 600px;
background-size: contain;
}
#hy_top_2019 .block_team {
background: #aeddf2;
padding: 70px 50px 50px;
border-radius: 10px;
margin: 80px 0 50px;
}
#hy_top_2019 .block_team h3 {
background: #c00 url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/6_bg.png) no-repeat;
background-position: center bottom;
background-size: contain;
padding: 40px 0 135px;
text-align: center;
color: #fff;
border-radius: 10px 10px 0 0;
font-size: 24px!important;
line-height: 1.2!important;
}
#hy_top_2019 .block_team ul {
display: flex;
justify-content: space-between;
margin: -40px -15px 0;
}
#hy_top_2019 .block_team li {
background: #a20000;
padding: 35px 0;
z-index: 10;
width: calc((100% - 100px) / 3);
text-align: center;
color: #fff;
font-size: 20px;
position: relative;
}
#hy_top_2019 .block_team li:before {
content: "";
width: 35px;
height: 49px;
background-position: center bottom;
background-size: contain;
background-repeat: no-repeat;
display: block;
position: absolute;
top: -20px;
left: 10px;
}
#hy_top_2019 .block_team li:nth-child(1):before {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/6_1.png);
}
#hy_top_2019 .block_team li:nth-child(2):before {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/6_2.png);
}
#hy_top_2019 .block_team li:nth-child(3):before {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/6_3.png);
}
#hy_top_2019 #block11 {
text-align: center;
}
#hy_top_2019 #block11 p {
font-size: 24px;
text-align: center;
}
#hy_top_2019 #block11 ul {
margin: 0 auto;
text-align: center;
letter-spacing: -0.4em;
}
#hy_top_2019 #block11 ul li {
width: 17%;
display: inline-block;
margin: 0 1.5%;
}
#hy_top_2019 #block01 .mv_telework {
text-align: left;  }
#hy_top_2019 #block01 .mv_telework p {
text-align: center;
background: url(//help-you.me/wp1/wp-content/uploads/2020/11/telework_pioneer_500.png) center top no-repeat;
background-size: 50px auto;
padding: 60px 0 0;
display: inline-block;
line-height: 1.5;
margin-bottom: 0;
font-size: 1rem;
}
#hy_top_2019 #block_faq{
margin: 50px auto -50px;
padding: 100px 0;
}
#hy_top_2019 #block_faq .faq_accordion_item{
display: none;
}
#hy_top_2019 #block_faq .q_sign{
color: #cc0000;
margin-right: 0.5em;
font-weight: bold;
font-size: larger;
}
#hy_top_2019 #block_faq .faq_question{
display: block;
padding: 0.8em 30px 0.8em 2.3em;
cursor: pointer;
position: relative;
font-size: 18px;
font-weight: 500;
border-top: 1px solid #ccc;
margin: 0;
text-indent: -1.5em;
}
#hy_top_2019 #block_faq .faq_question::before,
#hy_top_2019 #block_faq .faq_question::after{
content: '';
width: 14px;
height: 2px;
background: #666;
position: absolute;
top: 50%;
right: 15px;
transform: translateY(-50%);
}
#hy_top_2019 #block_faq .faq_question::after{
transform: translateY(-50%) rotate(90deg);
transition: .3s ease all;
}
#hy_top_2019 #block_faq .faq_accordion_item:checked + .faq_question:after{
transform: translateY(-50%) rotate(0);
}
#hy_top_2019 #block_faq .faq_answer{
display: block;
height: 0;
overflow: hidden;
padding: 0;
opacity: 0;
transition: 0.5s;
font-weight: normal;
margin: 0;
}
#hy_top_2019 #block_faq .faq_accordion_item:checked + .faq_question + .faq_answer{
height: auto;
opacity: 1;
padding: 0.7em;
background: #F9E5E6;
font-size: 15px;
line-height: 1.8;
margin: 0 10px 1em 10px;
} #hy_usage #block01 {
padding-top: 0;
padding-bottom: 100px;
margin-bottom: 0;
}
#hy_usage #block01 h2 {
color: #fff;
background: #cc0000;
font-size: 28px;
margin-bottom: 2em;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
}
#hy_usage #block01 ul {
display: flex;
flex-wrap: wrap;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li {
padding: 0 0 190px;
text-align: left;
height: 220px;
width: 20%;
cursor: pointer;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li:hover {
opacity: 0.8;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li.keiri {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_01.png) center bottom no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li.saiyou {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_02.png) center bottom no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li.hisho {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_03.png) center bottom no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li.eigyou {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_04.png) center bottom no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li.ec {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/goirai_05.png) center bottom no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li p {
line-height: 2.6em;
text-align: center;
height: 3em;
font-size: 18px;
color: #c60000;
font-weight: bold;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li:last-child p {
line-height: 1.3em;
}
#hy_usage #block01 ul > li.ChangeElem_Panel {
position: relative;
padding: 20px 40px;
background-color: #fff;
border: 2px solid #c6b299;
border-radius: 6px;
display: none;
width: 100%;
margin-top: 20px;
box-sizing: border-box;
}
#hy_usage #block01 ul > li.ChangeElem_Panel.is-active {
display: flex;
}
#hy_usage #block01 ul > li.ChangeElem_Panel::before,
#hy_usage #block01 ul > li.ChangeElem_Panel::after {
position: absolute;
top: -25px;
left: 9%;
content: "";
height: 0;
width: 0;
border: 10px solid transparent;
}
#hy_usage #block01 ul > li.ChangeElem_Panel.keiri::before,
#hy_usage #block01 ul > li.ChangeElem_Panel.keiri::after {
left: 9%;
}
#hy_usage #block01 ul > li.ChangeElem_Panel.saiyou::before,
#hy_usage #block01 ul > li.ChangeElem_Panel.saiyou::after {
left: 29%;
}
#hy_usage #block01 ul > li.ChangeElem_Panel.hisho::before,
#hy_usage #block01 ul > li.ChangeElem_Panel.hisho::after {
left: 49%;
}
#hy_usage #block01 ul > li.ChangeElem_Panel.eigyou::before,
#hy_usage #block01 ul > li.ChangeElem_Panel.eigyou::after {
left: 69%;
}
#hy_usage #block01 ul > li.ChangeElem_Panel.ec::before,
#hy_usage #block01 ul > li.ChangeElem_Panel.ec::after {
left: 89%;
}
#hy_usage #block01 ul > li.ChangeElem_Panel::before {
border-bottom: 15px solid #c6b299;
}
#hy_usage #block01 ul > li.ChangeElem_Panel::after {
margin-top: 4px;
border-bottom: 15px solid #fff;
}
#hy_usage #block01 ul div {
margin-right: 30px;
}
#hy_usage #block01 ul ul {
flex-direction: column;
padding-left: 2em;
}
#hy_usage #block01 ul ul li {
list-style: disc;
}
#hy_usage #block01 ul h3 {
line-height: 2.6em;
font-size: 18px;
color: #c60000;
font-weight: bold;
}
#hy_usage #block01 ul.row li a {
text-align: center;
width: 100%;
height: 300px;
padding-top: 200px;
display: block;
font-size: 18px;
color: #333;
max-width: 205px;
margin: 0 auto;
}
#hy_usage #block01 ul.row li.usage01 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_01.png) center top no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.row li.usage02 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_02.png) center top no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.row li.usage03 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_03.png) center top no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.row li.usage04 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_04.png) center top no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.row li.usage05 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_05.png) center top no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.row li.usage06 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_06.png) center top no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.row li.usage07 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_07.png) center top no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.row li.usage08 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_08.png) center top no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.row li.usage09 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_09.png) center top no-repeat;
background-size: contain;
}
#hy_usage #block01 ul.row li.usage10 a {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/gyoumuirai_10.png) center top no-repeat;
background-size: contain;
}
.modal_inner {
text-align: center;
margin: 0 auto;
}
.modal_inner h3 {
text-align: center;
width: 300px;
height: 300px;
padding-top: 250px;
margin: 30px auto 0;
color: #c00;
max-width: 100%;
font-size: 30px;
font-weight: bold;
}
.modal_inner p {
margin: 0 auto 30px;
text-align: left;
display: inline-block;
max-width: 100%;
line-height: 1.7em;
font-size: 16px;
}
.modal_inner .close {
position: absolute;
top: 10px;
right: 10px;
width: 40px;
height: 40px;
}
.modal_inner .close a {
position: relative;
width: 100%;
height: 100%;
display: block;
opacity: 0.8;
}
.modal_inner .close a:before,
.modal_inner .close a:after {
content: "";
display: block;
position: absolute;
top: calc(50% - 2px);
left: 0;
width: 100%;
height: 2px;
background-color: #000;
}
.modal_inner .close a:before {
transform: rotate(45deg);
}
.modal_inner .close a:after {
transform: rotate(-45deg);
}
#usage01 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_01.png) center top no-repeat;
background-size: 300px;
}
#usage02 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_02.png) center top no-repeat;
background-size: 300px;
}
#usage03 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_03.png) center top no-repeat;
background-size: 300px;
}
#usage04 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_04.png) center top no-repeat;
background-size: 300px;
}
#usage05 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_05.png) center top no-repeat;
background-size: 300px;
}
#usage06 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_06.png) center top no-repeat;
background-size: 300px;
}
#usage07 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_07.png) center top no-repeat;
background-size: 300px;
}
#usage08 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_08.png) center top no-repeat;
background-size: 300px;
}
#usage09 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_09.png) center top no-repeat;
background-size: 300px;
}
#usage10 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/illust_gyoumu_10.png) center top no-repeat;
background-size: 300px;
}
#hy_usage #block02 {
margin-top: 0;
padding-top: 0;
}
#hy_usage #block02 h2 {
color: #fff;
background: #cc0000;
font-size: 28px; padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
}
#hy_usage #block02 h3 {
margin-bottom: 0.5em;
font-weight: bold;
}
#hy_usage #block02 .block02_1,
#hy_usage #block02 .block02_2 {
margin-bottom: 50px;
}
#hy_usage #block02 .block02_1_1 {
border-left: 4px solid #c7b100;
padding-left: 30px;
text-align: left;
}
#hy_usage #block02 .block02_2_1 {
border-left: 4px solid #db4d4d;
padding-left: 30px;
text-align: left;
}
#hy_usage #block02 .block02_3_1 {
border-left: 4px solid #00749d;
padding-left: 30px;
text-align: left;
}
#hy_usage #block02 .block02_1_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/katsuyoujirei_01.png) center top no-repeat;
background-size: contain;
padding: 15px 35px 15px 60px;
min-height: 230px;
}
#hy_usage #block02 .block02_2_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/katsuyoujirei_02.png) center top no-repeat;
background-size: contain;
padding: 15px 35px 15px 60px;
min-height: 230px;
}
#hy_usage #block02 .block02_3_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/katsuyoujirei_03.png) center top no-repeat;
background-size: contain;
padding: 15px 35px 15px 60px;
min-height: 230px;
}
#hy_usage #block02 .block02_1_2 h4,
#hy_usage #block02 .block02_2_2 h4,
#hy_usage #block02 .block02_3_2 h4 {
margin: 15px 0 0 150px;
padding: 0;
background: none;
font-size: 18px;
height: 90px;
line-height: 1.3em;
}
#hy_usage #block02 .block02_1_2 p,
#hy_usage #block02 .block02_2_2 p,
#hy_usage #block02 .block02_3_2 p {
line-height: 1.3em;
margin-bottom: 0;
min-height: 90px;
}
#hy_usage #block03 {
position: relative;
}
#hy_usage #block03 a {
display: block;
margin-left: -15px;
margin-right: -15px;
}
#hy_usage #block03 a:hover {
opacity: 0.8;
}
#hy_usage #block03 h2 {
color: #fff;
background: #cc0000;
font-size: 28px;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
position: absolute;
top: 0;
left: 0;
z-index: 100;
}
#hy_usage #block03 h3 {
display: inline-block;
margin-top: 2em;
margin-left: 15px;
padding: 0.3em;
font-weight: bold;
color: #cc0000;
font-size: 2vw;
border: #c00 solid 2px;
}
#hy_usage #block03 .block03_3 h3 {
background: rgba(255, 255, 255, 0.5);
}
#hy_usage #block03 .block03_1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/hisyo.png) center bottom no-repeat;
background-size: contain;
height: calc(100vw / 3);
position: relative;
}
#hy_usage #block03 .block03_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/jinzai.png) center bottom no-repeat;
background-size: contain;
height: calc(100vw / 3);
position: relative;
}
#hy_usage #block03 .block03_3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/marketing.png) center bottom no-repeat;
background-size: contain;
height: calc(100vw / 3);
position: relative;
}
#hy_usage #block03 p {
position: absolute;
bottom: 0;
left: 50%;
display: block;
width: 100%;
margin-bottom: 0;
line-height: 4em;
color: #fff;
font-weight: bold;
font-size: 1.6vw;
text-align: center;
background: rgba(204, 0, 0, 0.5);
transform: translateX(-50%);
}
#hy_usage #block03 a:hover p {
background: rgba(204, 0, 0, 1);
text-decoration: none;
}
#hy_usage #block03 p:after {
content: "";
display: inline-block;
vertical-align: middle;
margin-left: 0.5em;
margin-bottom: 0.15em; width: 0;
height: 0;
border-style: solid;
border-width: 0.5em 0 0.5em 0.6em;
border-color: transparent transparent transparent #fff;
} #hy_case #block01 ul.slider {
background: #cc0000;
}
#hy_case #block01 ul.slider li img {
opacity: 0.6;
}
#hy_case #block01 ul.slider li.slick-current img {
opacity: 1;
}
#hy_case #block01 ul.slider_thumbnail,
#hy_case #block01 ul.slick-dots {
background: #cc0000;
padding: 10px calc(50vw - 470px);
display: flex !important;
position: static;
bottom: auto;
}
#hy_case #block01 ul.slider_thumbnail li {
}
#hy_case #block01 ul.slick-dots li {
width: auto;
height: auto;
}
#hy_case #block01 ul.slider_thumbnail li img,
#hy_case #block01 ul.slick-dots li img {
opacity: 0.6;
width: 90%;
margin: 0 5%;
}
#hy_case #block01 ul.slider_thumbnail li.slick-current img,
#hy_case #block01 ul.slick-dots li.slick-active img {
opacity: 1;
}
#hy_case #block02 {
margin: 0 auto 50px;
padding: 0 0 50px;
}
#hy_case #block02 h2 {
display: none;
}
#hy_case #block02 .list_g,
#hy_case #block02 .list_g li,
#hy_case #block02 .tag_g {
background: #8cc63f;
color: #fff;
}
#hy_case #block02 .list_y,
#hy_case #block02 .list_y li,
#hy_case #block02 .tag_y {
background: #dfd000;
color: #fff;
}
#hy_case #block02 .list_r,
#hy_case #block02 .list_r li,
#hy_case #block02 .tag_r {
background: #db4d4d;
color: #fff;
}
#hy_case #block02 .list_b,
#hy_case #block02 .list_b li,
#hy_case #block02 .tag_b {
background: #00a99d;
color: #fff;
}
#hy_case #block02 .tag_g,
#hy_case #block02 .tag_y,
#hy_case #block02 .tag_r,
#hy_case #block02 .tag_b {
display: block;
padding: 0.5em 1em;
margin: 0 0 0.2em 0;
line-height: 1em;
text-align: center;
}
#hy_case #block02 .tag_y,
#hy_case #block02 .tag_r {
display: none;
}
#hy_case #block02 .list_g,
#hy_case #block02 .list_y,
#hy_case #block02 .list_r,
#hy_case #block02 .list_b {
position: relative;
}
#hy_case #block02 .list_g:hover,
#hy_case #block02 .list_y:hover,
#hy_case #block02 .list_r:hover,
#hy_case #block02 .list_b:hover {
opacity: 0.8;
}
#hy_case #block02 .block02_1 {
margin-bottom: 50px;
}
#hy_case #block02 .block02_1 h3 {
cursor: pointer;
padding: 0.5em;
line-height: 1em;
position: relative;
}
#hy_case #block02 .block02_1 h3:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: #fff transparent transparent transparent;
position: absolute;
top: calc(50% - 5px);
right: 5%;
}
#hy_case #block02 .block02_1 h3.active:after {
transform: rotate(180deg);
}
#hy_case #block02 .block02_1 ul {
display: none;
}
#hy_case #block02 .block02_1 li {
display: block;
cursor: pointer;
line-height: 1em;
padding: 0.5em 1em;
}
#hy_case #block02 .block02_1 li:hover {
opacity: 0.8;
}
#hy_case #block02 .block02_2 li {
margin-bottom: 50px;
}
#hy_case #block02 .block02_2 li a h3 {
color: #333;
font-size: 16px;
font-weight: bold;
margin: 0.5em 0 0.7em 0;
}
#hy_case #block02 .block02_2 li a .imgblock {
height: 175px;
overflow: hidden;
}
#hy_case #block02 .block02_2 li a .imgblock img {
min-width: 100%;
min-height: 100%;
object-fit: cover;
object-position: 50% 100%;
transition: 0.5s;
}
#hy_case #block02 .block02_2 li a:hover .imgblock img {
opacity: 0.7;
}
#hy_case #block02 .block02_2 li p.case_catchcopy {
line-height: 1.3;
margin-bottom: 0.5em;
} #hy_sample #block01 h2 {
color: #fff;
background: #cc0000;
font-size: 28px;
margin-bottom: 2em;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
}
#hy_sample #block01 .block01_1 {
margin-bottom: 50px;
}
#hy_sample #block01 .block01_1_1 h3 {
color: #cc0000;
font-size: 24px;
text-align: left;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_sample #block01 .block01_1_1 h4 {
color: #cc0000;
font-size: 20px;
text-align: left;
line-height: 1em;
margin-bottom: 1em;
font-weight: bold;
background: #f9e5e6;
display: inline-block;
padding: 0.5em;
}
#hy_sample #block01 .block01_1_2 {
border: 4px solid #cc0000;
padding: 15px;
text-align: center;
}
#hy_sample #block01 .block01_1_2 h3 {
color: #cc0000;
font-size: 20px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_sample #block01 .block01_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/flow_ba.gif) center bottom no-repeat;
background-size: contain;
height: 1350px;
margin-bottom: 75px;
}
#hy_sample #block02 h2 {
color: #fff;
background: #cc0000;
font-size: 28px;
margin-bottom: 2em;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
}
#hy_sample #block02 .row > div {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-content: stretch;
}
#hy_sample #block02 .block02_1,
#hy_sample #block02 .block02_2,
#hy_sample #block02 .block02_3,
#hy_sample #block02 .block02_4 {
width: 48%;
text-align: center;
border: #cc0000 solid 4px;
margin-bottom: 30px;
}
#hy_sample #block02 .block02_3,
#hy_sample #block02 .block02_4 {
margin-bottom: 0;
}
#hy_sample #block02 h3 {
font-size: 16px;
color: #cc0000;
margin: 15px auto;
}
#hy_sample #block02 p {
margin-bottom: 0;
}
#hy_sample #block02 .block02_1 .block02_1_1,
#hy_sample #block02 .block02_1 .block02_1_2,
#hy_sample #block02 .block02_2 .block02_2_1,
#hy_sample #block02 .block02_2 .block02_2_2,
#hy_sample #block02 .block02_3 .block02_3_1,
#hy_sample #block02 .block02_3 .block02_3_2,
#hy_sample #block02 .block02_4 .block02_4_1,
#hy_sample #block02 .block02_4 .block02_4_2 {
width: 80%;
margin: 15px auto;
padding: 15px 15px 0 15px;
background: #f9e5e6;
}
#hy_sample #block02 .img {
width: 100%;
height: 200px;
}
#hy_sample #block02 .block02_1 .block02_1_1 .img {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/sample/siryousakusei/1/ilovepdf_com.jpg) left top no-repeat;
background-size: cover;
}
#hy_sample #block02 .block02_1 .block02_1_2 .img {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/sample/siryousakusei/2/ilovepdf_com.jpg) left top no-repeat;
background-size: cover;
}
#hy_sample #block02 .block02_2 .block02_2_1 .img {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/sample/resarch/reserch_02.png) left top no-repeat;
background-size: cover;
}
#hy_sample #block02 .block02_2 .block02_2_2 .img {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/sample/resarch/reserch_01.jpg) left top no-repeat;
background-size: cover;
}
#hy_sample #block02 .block02_3 .block02_3_1 .img {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/sample/koukokuunyou/unyou_02.png) left top no-repeat;
background-size: cover;
}
#hy_sample #block02 .block02_3 .block02_3_2 .img {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/sample/koukokuunyou/unyou_04.png) left top no-repeat;
background-size: cover;
}
#hy_sample #block02 .block02_4 .block02_4_1 .img {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/sample/keiri/keiri_03.png) left top no-repeat;
background-size: cover;
}
#hy_sample #block02 .block02_4 .block02_4_2 .img {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/sample/keiri/keiri_01.jpg) left top no-repeat;
background-size: cover;
}   .page-id-5328 ul.gMenu > li#menu-item-3448,
.page-id-5328 ul.gMenu > li#menu-item-3451,
.page-id-5328 ul.gMenu > li#menu-item-3503,
.page-id-5328 ul.gMenu > li#menu-item-3456,
.page-id-5328 .vk-mobile-nav nav ul li#menu-item-3448,
.page-id-5328 .vk-mobile-nav nav ul li#menu-item-3451,
.page-id-5328 .vk-mobile-nav nav ul li#menu-item-3503,
.page-id-5328 .vk-mobile-nav nav ul li#menu-item-3456 {
display: none;
}
.page-id-5328.page .entry-body {
padding-bottom: 0;
}
.page-id-5328 .siteContent {
padding: 0;
}
#hy_oflinelp h1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/oflinelp/oflinelp_title.jpg) center bottom no-repeat;
background-size: cover;
width: 100%;
min-height: 767px;
text-indent: -9999px;
margin-bottom: 50px;
} #Saas_tool_page h2.title,
.hy_landing_page h2.title {
color: #fff;
background: #cc0000;
font-size: 24px;
padding: 0.8em 1em 0.8em 1em;
display: inline-block;
font-weight: bold;
width: 100%;
margin-bottom: 0.5em;
}
#Saas_tool_page h3.title,
.hy_landing_page h3.title {
color: #cc0000;
font-weight: bold;
padding: 0.3em 15px;
border-left: 4px solid #cc0000;
margin-top: 1em;
}
#Saas_tool_page .link_btn,
.hy_landing_page .link_btn {
padding: 0.7em 1em;
border: 3px solid #cc0000;
border-radius: 2em;
font-size: 20px;
background: #f9e5e6;
position: relative;
width: 100%;
display: block;
text-align: center;
margin: 1em auto;
color: #cc0000;
transition: 0.3s;
margin: 2em 0 3em;
text-decoration: none;
}
#Saas_tool_page .link_btn:hover,
.hy_landing_page .link_btn:hover {
border: 3px solid #cc0000;
background: #cc0000;
color: #fff;
text-decoration: none;
}
@media screen and (max-width: 1286px) {
#hy_oflinelp h1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/oflinelp/oflinelp_title2.jpg) center bottom no-repeat;
background-size: contain;
min-height: auto;
height: 59.6vw;
}
}
#hy_oflinelp .tri {
width: 0;
height: 0;
border-top: 70px solid #fff;
border-right: 125px solid transparent;
border-bottom: 0px solid transparent;
border-left: 125px solid transparent;
position: absolute;
top: 0px;
left: calc((100% - 250px) / 2);
z-index: 0;
}
#hy_oflinelp #block01,
#hy_oflinelp #block02,
#hy_oflinelp #block03,
#hy_oflinelp #block04,
#hy_oflinelp #block05,
#hy_oflinelp #block06,
#hy_oflinelp #block08 {
position: relative;
}
#hy_oflinelp #block03,
#hy_oflinelp #block04,
#hy_oflinelp #block05,
#hy_oflinelp #block06,
#hy_oflinelp #block08 {
padding: 100px 0 50px;
margin: 0 auto;
}
#hy_oflinelp #block03 .tri,
#hy_oflinelp #block06 .tri,
#hy_oflinelp #block08 .tri {
border-top: 70px solid #fff;
}
#hy_oflinelp #block01 .tri,
#hy_oflinelp #block04 .tri,
#hy_oflinelp #block05 .tri {
border-top: 70px solid #f0f0f0;
}
#hy_oflinelp #block02 {
margin: 0 auto;
padding: 0 0 50px;
}
#hy_oflinelp #block02 .btn-lg {
padding: 0.5rem 1rem;
font-size: 1.25rem;
line-height: 1.5;
border-radius: 5px;
width: 30vw;
}
#hy_oflinelp #block03,
#hy_oflinelp #block06 {
text-align: center;
background: #f0f0f0;
}
#hy_oflinelp #block03 h2,
#hy_oflinelp #block04 h2,
#hy_oflinelp #block05 h2,
#hy_oflinelp #block06 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_oflinelp #block03 h2 span {
font-size: 15px;
line-height: 1.3em;
color: #333;
}
#hy_oflinelp .block03_1 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/oflinelp/oflinelp_01.png) center top no-repeat;
background-size: contain;
text-indent: -9999px;
width: 100%;
height: 22.3vw;
max-height: 233px;
}
#hy_oflinelp .block03_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/oflinelp/oflinelp_02.png) center top no-repeat;
background-size: contain;
text-indent: -9999px;
width: 100%;
height: 75vw;
max-height: 1127px;
}
#hy_oflinelp .block03_2 h3 {
text-indent: -9999px;
}
#hy_oflinelp .block06_1 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/oflinelp/oflinelp_03.png) center top no-repeat;
background-size: contain;
text-indent: -9999px;
width: 100%;
height: 53vw;
max-height: 510px;
}
#hy_oflinelp .block06_1 ul {
text-align: left;
margin-left: 15px;
}
#hy_oflinelp .block06_1 ul li span {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/oflinelp/oflinelp_icon.png) left top no-repeat;
background-size: contain;
text-indent: -9999px;
width: 90px;
height: 20px;
display: inline-block;
}
#hy_oflinelp .block04_1 h3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/oflinelp/oflinelp_04.png) center bottom no-repeat;
background-size: contain;
text-indent: -9999px;
width: 100%;
height: 60vw;
max-height: 620px;
}
#hy_oflinelp #block05 p {
}
#hy_oflinelp .block05_1,
#hy_oflinelp .block05_2,
#hy_oflinelp .block05_3 {
position: relative;
margin-top: 80px;
}
#hy_oflinelp .block05_1 p.point,
#hy_oflinelp .block05_2 p.point,
#hy_oflinelp .block05_3 p.point {
background: #c60000;
color: #fff;
position: absolute;
z-index: 100;
top: -55px;
left: 20px;
border-radius: 50%;
width: 4.6em;
height: 4.6em;
font-size: 14px;
line-height: 1em;
text-align: center;
padding-top: 0.2em;
}
#hy_oflinelp .block05_1 p.point span,
#hy_oflinelp .block05_2 p.point span,
#hy_oflinelp .block05_3 p.point span {
font-size: 2em;
line-height: 1em;
}
#hy_oflinelp .block05_1 p.point span:before,
#hy_oflinelp .block05_2 p.point span:before,
#hy_oflinelp .block05_3 p.point span:before {
content: "\A";
white-space: pre;
}
#hy_oflinelp .block05_1 p.point:after,
#hy_oflinelp .block05_2 p.point:after,
#hy_oflinelp .block05_3 p.point:after {
content: "";
position: absolute;
left: calc(50% - 5px);
bottom: -8px;
width: 0;
height: 0;
border-top: 10px solid #c60000;
border-right: 5px solid transparent;
border-bottom: 0px solid transparent;
border-left: 5px solid transparent;
}
#hy_oflinelp .block05_1 h3,
#hy_oflinelp .block05_2 h3,
#hy_oflinelp .block05_3 h3 {
background: #f9e5e5;
color: #c60000;
border-radius: 5px;
font-size: 18px;
line-height: 1.3em;
text-align: center;
padding: 1em;
font-weight: bold;
}
#hy_oflinelp .block05_1 h3 {
line-height: 2.6;
}
#hy_oflinelp #block01 {
margin: 0 auto;
padding: 100px 0 50px;
}
#hy_oflinelp #block01 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_oflinelp #block01 .block01_1 .row > div,
#hy_oflinelp #block01 .block01_2 .row > div {
position: relative;
background-size: 75% auto;
padding: 240px 40px 15px;
height: 460px;
text-align: center;
}
#hy_oflinelp #block01 .block01_1 {
margin-bottom: 75px;
}
#hy_oflinelp #block01 .block01_2 {
display: none;
}
#hy_oflinelp #block01 .block01_1 .row > div h3,
#hy_oflinelp #block01 .block01_2 .row > div h3 {
display: none;
}
#hy_oflinelp #block01 .block01_1 .row > div p,
#hy_oflinelp #block01 .block01_2 .row > div p {
height: 50px;
}
#hy_oflinelp #block01 .block01_1 .row > div p.price,
#hy_oflinelp #block01 .block01_2 .row > div p.price {
font-size: 30px;
line-height: 1em;
margin-bottom: 0.6em;
}
#hy_oflinelp #block01 .block01_1 .row > div p.price span,
#hy_oflinelp #block01 .block01_2 .row > div p.price span {
font-size: 0.5em;
}
#hy_oflinelp #block01 .block01_1 .row > div a p,
#hy_oflinelp #block01 .block01_2 .row > div a p {
height: auto;
}
#hy_oflinelp #block01 .block01_1 .block01_1_1,
#hy_oflinelp #block01 .block01_2 .block01_2_1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/price/pran_trial.gif) center bottom no-repeat;
}
#hy_oflinelp #block01 .block01_1 .block01_1_2,
#hy_oflinelp #block01 .block01_2 .block01_2_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/price/pran_economy.gif) center bottom no-repeat;
}
#hy_oflinelp #block01 .block01_1 .block01_1_3,
#hy_oflinelp #block01 .block01_2 .block01_2_3 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/price/pran_business.gif) center bottom no-repeat;
}
#hy_oflinelp #block01 .block01_1 .block01_1_4,
#hy_oflinelp #block01 .block01_2 .block01_2_4 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/price/pran_first.gif) center bottom no-repeat;
}
#hy_oflinelp #block01 .block01_1 .block01_1_2:after,
#hy_oflinelp #block01 .block01_2 .block01_2_2:after,
#hy_oflinelp #block01 .block01_1 .block01_1_3:after,
#hy_oflinelp #block01 .block01_2 .block01_2_3:after,
#hy_oflinelp #block01 .block01_1 .block01_1_4:after,
#hy_oflinelp #block01 .block01_2 .block01_2_4:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 20px 0 20px 20px;
border-color: transparent transparent transparent #dfd000;
position: absolute;
transform: rotate(90deg);
left: calc(50% - 10px);
bottom: -60px;
}
#hy_oflinelp #block01 .block01_1 .block01_1_3:after,
#hy_oflinelp #block01 .block01_2 .block01_2_3:after {
border-color: transparent transparent transparent #cc0000;
opacity: 0.7;
}
#hy_oflinelp #block01 .block01_1 .block01_1_4:after,
#hy_oflinelp #block01 .block01_2 .block01_2_4:after {
border-color: transparent transparent transparent #00a99d;
}
#hy_oflinelp #block01 .block01_1 .row > div.block01_1_5,
#hy_oflinelp #block01 .block01_2 .row > div.block01_2_5 {
border: #c00 solid 4px;
height: auto;
padding: 15px;
margin-top: 80px;
}
#hy_oflinelp #block01 .block01_1 .row > div.block01_1_5 h4,
#hy_oflinelp #block01 .block01_2 .row > div.block01_2_5 h4 {
color: #cc0000;
}
#hy_oflinelp #block01 .block01_1 .row > div.block01_1_5 p,
#hy_oflinelp #block01 .block01_2 .row > div.block01_2_5 p {
height: auto;
margin-bottom: 0;
}
#hy_oflinelp #block01 .block01_1 a,
#hy_oflinelp #block01 .block01_2 a {
padding: 0.7em 1em;
border: 2px solid #cc0000;
border-radius: 2em;
font-size: 16px;
background: #f9e5e6;
position: relative;
width: 80%;
display: block;
text-align: center;
margin: 1em auto;
color: #cc0000;
transition: 0.3s;
}
#hy_oflinelp #block01 .block01_1 a:hover,
#hy_oflinelp #block01 .block01_2 a:hover {
border: 2px solid #cc0000;
background: #cc0000;
color: #fff;
text-decoration: none;
}
#hy_oflinelp #block01 .block01_3 h3 {
background: #dccab8;
font-size: 18px;
width: calc(100% - 15px);
padding: 0.5em;
line-height: 1em;
margin-bottom: 2em;
}
#hy_oflinelp #block01 .block01_3 h3:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 30px 0 30px 30px;
border-color: transparent transparent transparent #dccab8;
position: absolute;
top: calc(50% - 30px);
right: -30px;
}
#hy_oflinelp #block01 .block01_3 h4 {
color: #cc0000;
font-size: 16px;
}
#hy_oflinelp #block08 {
text-align: center;
background: #f0f0f0;
margin: 0 auto;
padding: 100px 0 50px;
}
#hy_oflinelp #block08 h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_oflinelp #block08 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_oflinelp #block08 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_oflinelp p.text {
font-size: 18px;
font-weight: bold;
max-width: 90%;
margin: 0 auto 40px;
}
#hy_oflinelp #block08 ul {
margin: 0 auto;
text-align: center;
display: flex;
justify-content: space-between;
}
#hy_oflinelp #block08 li {
width: 30%;
background: #f9e5e6;
position: relative;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);
}
#hy_oflinelp #block08 li div {
margin: 15px;
}
#hy_oflinelp #block08 li div p.step {
display: inline-block;
font-size: 25px;
vertical-align: baseline;
line-height: 1em;
margin: 0;
width: 100%;
font-weight: bold;
color: #cc0000;
}
#hy_oflinelp #block08 li div p.step span {
font-size: 50px;
line-height: 1em;
}
#hy_oflinelp #block08 li div p.step span:before {
content: "\A";
white-space: pre;
}
#hy_oflinelp #block08 li div h3 {
display: inline-block;
font-size: 30px;
vertical-align: baseline;
padding: 0;
line-height: 1.2em;
margin: 0;
font-weight: bold;
color: #cc0000;
height: 2.4em;
}
#hy_oflinelp #block08 li:nth-child(2) div h3 {
line-height: 2.4em;
}
#hy_oflinelp #block08 li div p.description {
text-align: left;
padding-top: 110px;
margin-top: 30px;
}
#hy_oflinelp #block08 li:nth-child(1) div p.description {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/speed_01_sp.gif) center top no-repeat;
background-size: 60%;
}
#hy_oflinelp #block08 li:nth-child(2) div p.description {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/speed_02_sp.gif) center top no-repeat;
background-size: 70%;
}
#hy_oflinelp #block08 li:nth-child(3) div p.description {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/speed_03_sp.gif) center top no-repeat;
background-size: 45%;
}
#hy_oflinelp #block08 li:nth-child(1):after,
#hy_oflinelp #block08 li:nth-child(2):after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 20px 0 20px 20px;
border-color: transparent transparent transparent #cc0000;
position: absolute;
top: calc(50% - 16px);
right: -13%;
}
#hy_oflinelp #block08 .link_button {
margin-top: 60px;
} #hy_storeowner {
margin-top: -2em;
}
#hy_storeowner header {
padding-bottom: 1em;
padding-left: 1em;
}
#hy_storeowner header img {
width: 150px;
}
#hy_storeowner h2 {
line-height: 1.3;
}
#hy_storeowner #block_mv {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/storeowner/mv.jpg) center bottom no-repeat;
background-size: cover;
min-height: auto;
height: 500px;
position: relative;
}
#hy_storeowner #block_mv h1 {
text-indent: -9999px;
background: transparent;
height: 1em;
}
#hy_storeowner #block_mv .text {
height: 500px;
width: auto;
position: absolute;
top: 0;
left: 15%;
}
#hy_storeowner .contact {
padding: 3em 1em;
}
#hy_storeowner .contact .btn-lg {
padding: 0.75rem 1rem;
font-size: 1.5rem;
line-height: 1.5;
border-radius: 10px;
width: 40vw;
}
#hy_storeowner .black_block {
background-color: #222222;
color: #fff;
text-align: center;
padding: 2em 1em 2.5em 1em;
position: relative;
}
#hy_storeowner .black_arrow_wrapper {
text-align: center;
}
#hy_storeowner .black_arrow {
width: 0px;
height: 0px;
display: inline-block;
width: 0;
height: 0;
border-top: solid 50px #222222;
border-right: solid 80px transparent;
border-bottom: solid 50px transparent;
border-left: solid 80px transparent;
z-index: 5;
}
#hy_storeowner .black_block h5 {
font-weight: normal;
margin-bottom: 0.5em;
font-size: 24px;
}
#hy_storeowner .black_block h4 {
font-size: 32px;
}
#hy_storeowner .black_block h4 span {
font-weight: normal;
color: #ebad7d;
font-size: larger;
}
#hy_storeowner #block_support {
background-color: #f0f0f0;
padding-top: 105px;
padding-bottom: 100px;
margin-top: -105px;
z-index: 3;
}
#hy_storeowner #block_support li:before {
content: "";
position: absolute;
top: -20px;
left: -7%;
display: block;
width: 75px;
height: 117px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/storeowner/balloon.png) center top no-repeat;
background-size: contain;
}
#hy_storeowner li.itemblock {
display: inline-block;
width: 28%;
margin: 0 2%;
box-sizing: border-box;
vertical-align: top;
box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.3);
border-radius: 10px;
position: relative;
}
#hy_storeowner li.itemblock .top {
background-color: #00749d;
text-align: center;
padding: 30px 1em;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
}
#hy_storeowner li.itemblock .top img {
max-width: 140px;
width: 50%;
}
#hy_storeowner li.itemblock .bottom {
background-color: #e4eff8;
padding: 1em 1.5vw;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
#hy_storeowner li.itemblock .bottom h4 {
text-align: center;
font-weight: bold;
color: #00749d;
margin-bottom: 0.5em;
line-height: 1.3;
}
#hy_storeowner li.itemblock .bottom p {
height: 7em;
text-align: left;
}
#hy_storeowner #block_online {
background-color: #f0f0f0;
padding-top: 105px;
padding-bottom: 100px;
margin-top: -105px;
z-index: 3;
}
#hy_storeowner .outside_block {
background-color: #fff;
padding: 4em 5%;
position: relative;
}
#hy_storeowner .outside_block h2 {
font-weight: bold;
text-align: center;
margin-bottom: 2em;
font-size: 26px;
}
#hy_storeowner .outside_block .point {
width: 120px;
height: auto;
position: absolute;
top: 3em;
left: 5%;
}
#hy_storeowner .inside_block {
background-color: #f9e3e3;
padding: 4em 5%;
margin-top: 2em;
}
#hy_storeowner #block_online {
text-align: center;
}
#hy_storeowner #block_online ul {
display: inline-block;
}
#hy_storeowner #block_online li {
display: inline-block;
width: 17%;
margin: 0 1%;
vertical-align: top;
}
#hy_storeowner #block_online li p {
font-size: 12.5px;
font-weight: bold;
}
#hy_storeowner #block_online li img {
margin-bottom: 1em;
}
#hy_storeowner #block_online .inside_block ul {
width: 100%;
}
#hy_storeowner #block_online .inside_block li {
width: 18.89%;
margin: 0 3%;
}
#hy_storeowner #block_online p {
text-align: center;
line-height: 1.3;
}
#hy_storeowner #block_example {
background-color: #f0f0f0;
}
#hy_storeowner #block_example .pc_img {
display: block;
}
#hy_storeowner #block_example .sp_img {
display: none;
}
#hy_storeowner #block_costcut {
background-color: #f0f0f0;
padding: 100px 5%;
}
#hy_storeowner #block_expert {
background-color: #f0f0f0;
padding-top: 105px;
padding-bottom: 100px;
margin-top: -105px;
z-index: 3;
}
#hy_storeowner #block_expert li.itemblock {
width: 39%;
margin: 0 4%;
}
#hy_storeowner #block_expert li.itemblock img {
width: 80%;
max-width: 200px;
}
#hy_storeowner .outside_block .txt {
text-align: center;
}
#hy_storeowner .outside_block h4.underline {
text-align: center;
font-size: 18px;
margin-bottom: 0;
letter-spacing: 0.05em;
font-weight: bold;
position: relative;
display: inline-block;
border-bottom: 2px solid #000;
border-radius: 0;
}
#hy_storeowner .outside_block h4.underline + h2 {
margin-top: 0.5em;
font-weight: bold;
letter-spacing: 0.05em;
}
#hy_storeowner .outside_block h4.underline + h2 span {
font-size: larger;
color: #ff915a;
}
#hy_storeowner #block_expert h2 {
margin-bottom: 2.5em;
}
#hy_storeowner #block_compare {
background-color: #f0f0f0;
padding-top: 105px;
padding-bottom: 100px;
margin-top: -105px;
z-index: 3;
}
#hy_storeowner #block_compare li.itemblock {
width: 39%;
margin: 0 4%;
}
#hy_storeowner #block_compare li.itemblock .top img {
width: 80%;
max-width: 200px;
}
#hy_storeowner #block_compare li.itemblock h4 {
height: 2.5em;
margin-bottom: 0.5em;
}
#hy_storeowner #block_price {
padding: 4em 0;
text-align: center;
}
#hy_storeowner #block_price h2 {
font-weight: bold;
margin-bottom: 1.5em;
text-align: center;
font-size: 26px;
line-height: 1.3em;
}
#hy_storeowner #block_price ul {
text-align: left;
display: inline-block;
}
#hy_storeowner #block_price li {
display: inline-block;
margin-right: 2.5em;
}
#hy_storeowner #block_price li h4 {
border-radius: 5px;
padding: 0.5em 2.5em;
margin-right: 1em;
display: inline-block;
font-weight: bold;
font-size: 16px;
vertical-align: middle;
letter-spacing: 0.05em;
}
#hy_storeowner #block_price p {
font-weight: bold;
font-size: 37px;
display: inline-block;
vertical-align: middle;
margin-bottom: 0;
}
#hy_storeowner #block_price p span {
font-size: 22px;
}
#hy_storeowner #block_price li.initial h4 {
background-color: #c60000;
color: white;
}
#hy_storeowner #block_price li.initial p {
color: #c60000;
}
#hy_storeowner #block_price li.monthly h4 {
border: 0.5px solid #000;
font-weight: bold;
}
#hy_storeowner #block08 {
text-align: center;
background: #f0f0f0;
margin: 0 auto;
padding: 100px 0 50px;
position: relative;
}
#hy_storeowner #block08 h2 {
color: #cc0000;
font-size: 26px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
#hy_storeowner #block08 h2 span {
font-size: 15px;
line-height: 1.3em;
}
#hy_storeowner #block08 h2 span:before {
content: "\A";
white-space: pre;
}
#hy_storeowner #block08 .title {
margin: 0;
}
#hy_storeowner p.text {
font-size: 18px;
font-weight: bold;
max-width: 90%;
margin: 0 auto 40px;
}
#hy_storeowner #block08 ul {
margin: 0 auto;
text-align: center;
display: flex;
justify-content: space-between;
}
#hy_storeowner #block08 li {
width: 30%;
background: #f9e5e6;
position: relative;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);
min-width: 243px;
}
#hy_storeowner #block08 li div {
margin: 15px;
}
#hy_storeowner #block08 li div p.step {
display: inline-block;
font-size: 22px;
vertical-align: middle;
line-height: 1em;
margin: 0; width: 57px;
margin-right: 10px;
font-weight: bold;
color: #cc0000;
}
#hy_storeowner #block08 li div p.step span {
font-size: 45px;
line-height: 1em;
}
#hy_storeowner #block08 li div p.step span:before {
content: "\A";
white-space: pre;
}
#hy_storeowner #block08 li div h3 {
display: inline-block;
font-size: 25px;
vertical-align: middle;
padding: 0;
line-height: 1.2em;
margin: 0;
font-weight: bold;
color: #cc0000;
height: 2.4em;
width: calc(100% - 75px);
text-align: left;
margin-top: 0.5em;
}
#hy_storeowner #block08 li:nth-child(2) div h3 {
line-height: 2.4em;
}
#hy_storeowner #block08 li div p.description {
text-align: left;
padding-top: 110px;
margin-top: 30px;
}
#hy_storeowner #block08 li:nth-child(1) div p.description {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/speed_01_sp.gif) center top no-repeat;
background-size: 60%;
}
#hy_storeowner #block08 li:nth-child(2) div p.description {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/speed_02_sp.gif) center top no-repeat;
background-size: 70%;
}
#hy_storeowner #block08 li:nth-child(3) div p.description {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/speed_03_sp.gif) center top no-repeat;
background-size: 45%;
}
#hy_storeowner #block08 li:nth-child(1):after,
#hy_storeowner #block08 li:nth-child(2):after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 20px 0 20px 20px;
border-color: transparent transparent transparent #cc0000;
position: absolute;
top: calc(50% - 16px);
right: -13%;
}
#hy_storeowner #block08 .link_button {
margin-top: 60px;
}
#hy_storeowner footer {
background-color: #030303;
padding: 4em 5%;
text-align: center;
color: white;
}
#hy_storeowner footer .link {
margin: 2em 0 1.5em;
}
#hy_storeowner footer a {
color: white;
text-decoration: none;
font-size: 12px;
}
#hy_storeowner footer p {
font-size: 12px;
margin: 0;
} #hy_accounting_firm {
margin-top: -2em;
background-color: #dbecef;
}
body.page-id-6190 .row {
display: block;
}
body.page-id-6190 .siteContent {
margin-top: 0 !important;
padding-bottom: 0;
}
#hy_accounting_firm header {
padding-bottom: 1em;
padding-left: 1em;
background-color: #fff;
}
#hy_accounting_firm header img {
width: 150px;
}
#hy_accounting_firm h2 {
line-height: 1.3;
}
#hy_accounting_firm a {
text-decoration: none;
}
#hy_accounting_firm a:hover {
text-decoration: none;
opacity: 0.7;
}
#hy_accounting_firm #block_mv {
background-color: #94d0d7;
min-height: auto;
height: auto;
position: relative;
text-align: left;
padding: 15px 0;
box-sizing: border-box;
margin-bottom: 100px;
}
#hy_accounting_firm #block_mv .row {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/accounting_firm/mv_img.png);
background-size: auto 90%;
background-position: right center;
background-repeat: no-repeat;
}
#hy_accounting_firm #block_mv .text {
display: inline-block;
position: relative;
letter-spacing: 0.05em;
}
#hy_accounting_firm #block_mv h4 {
color: #fff;
border: 0.5px solid #fff;
padding: 0.2em 0.7em;
border-radius: 3px;
font-weight: normal;
font-size: 16px;
display: inline-block;
}
#hy_accounting_firm #block_mv h1 {
color: #306392;
text-align: left;
font-size: 45px;
line-height: 1.5;
margin-bottom: 0.9em;
margin-top: 0.7em;
}
#hy_accounting_firm #block_mv h3 {
color: #306392;
font-weight: bold;
margin-bottom: 0.1em;
font-size: 20px;
}
#hy_accounting_firm #block_mv p {
color: #c60000;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/accounting_firm/mv_check.png);
background-position: left;
background-repeat: no-repeat;
background-size: 15px;
padding: 0 25px;
font-size: 13px;
}
#hy_accounting_firm #block_mv .forSP {
display: none;
}
#hy_accounting_firm section {
margin: 0 0 100px;
text-align: center;
}
#hy_accounting_firm section .wrapper {
max-width: 1000px;
}
#hy_accounting_firm .white_block.forSP {
display: none;
}
#hy_accounting_firm .white_block {
background-color: #fff;
width: 46%;
box-sizing: border-box;
height: 400px;
text-align: center;
position: relative;
padding: 1em;
vertical-align: middle;
display: inline-flex;
flex-direction: row;
align-items: center;
}
#hy_accounting_firm .green_block {
background-color: #94d0d7;
width: 52%;
box-sizing: border-box;
height: 450px;
padding: 1.5em;
vertical-align: middle;
display: inline-flex;
flex-direction: row;
align-items: center;
}
#hy_accounting_firm .white_block .contents {
display: block;
vertical-align: middle;
width: 100%;
}
#hy_accounting_firm .green_block .contents {
display: block;
vertical-align: middle;
width: 100%;
}
#hy_accounting_firm .white_block h3 {
color: #2c5f8c;
font-weight: bold;
font-size: 18px;
line-height: 1.3;
letter-spacing: 0.05em;
text-align: center;
}
#hy_accounting_firm section .left {
margin-right: 0;
}
#hy_accounting_firm section .right {
margin-left: 0;
}
#hy_accounting_firm .white_block .contact {
width: 100%;
}
#hy_accounting_firm .white_block .contact a {
display: inline-block;
background-color: #f13953;
border-radius: 5px;
color: white;
font-weight: bold;
font-size: 15px;
width: 80%;
padding: 0.7em 5%;
margin-top: 2em;
}
#hy_accounting_firm #block_help .white_block .arrow {
margin: 1em 0;
width: 65px;
}
#hy_accounting_firm #block_help .white_block ul {
text-align: left;
margin-bottom: 1em;
width: 80%;
display: inline-block;
}
#hy_accounting_firm #block_help .white_block li {
font-size: 12.5px;
padding-left: 40px;
position: relative;
margin-bottom: 1.2em;
}
#hy_accounting_firm #block_help .white_block li:before {
content: "";
display: block;
width: 30px;
height: 30px;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/accounting_firm/balloon.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
position: absolute;
left: 0;
top: -5px;
}
#hy_accounting_firm #block_help .green_block img {
max-height: 400px;
}
#hy_accounting_firm #block_support .green_block {
padding: 1em 0.5em;
height: 500px;
}
#hy_accounting_firm #block_support .green_block img {
height: 65px;
margin-bottom: 0.5em;
}
#hy_accounting_firm #block_support .green_block li {
display: inline-block;
width: 47%;
margin: 0 1% 1em 1%;
border: 5px solid #c0e4e8;
padding: 7px;
border-radius: 10px;
vertical-align: top;
}
#hy_accounting_firm #block_support .green_block li:nth-child(1),
#hy_accounting_firm #block_support .green_block li:nth-child(3) {
margin-left: 0;
}
#hy_accounting_firm #block_support .green_block li:nth-child(2),
#hy_accounting_firm #block_support .green_block li:nth-child(4) {
margin-right: 0;
}
#hy_accounting_firm #block_support .green_block li:nth-child(3),
#hy_accounting_firm #block_support .green_block li:nth-child(4) {
margin-bottom: 0;
}
#hy_accounting_firm #block_support .green_block li .bg {
width: 100%;
height: 100%;
padding: 1em 5%;
background: #97c6d2;
background: -moz-linear-gradient(top, #8cc1d1 0%, #a5cdd5 100%);
background: -webkit-linear-gradient(top, #8cc1d1 0%, #a5cdd5 100%);
background: linear-gradient(to bottom, #8cc1d1 0%, #a5cdd5 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8cc1d1', endColorstr='#a5cdd5',GradientType=0 );
}
#hy_accounting_firm #block_support .green_block li h4 {
font-weight: bold;
font-size: 17px;
letter-spacing: 0.05em;
color: #444444;
margin-bottom: 0.4em;
}
#hy_accounting_firm #block_support .green_block li p {
text-align: left;
font-size: 11.5px;
line-height: 1.5;
margin: 0;
min-height: 6em;
}
#hy_accounting_firm #block_support .white_block h3 {
font-size: 16px;
line-height: 1.5;
}
#hy_accounting_firm #block_possible .white_block h3 {
margin-bottom: 1em;
}
#hy_accounting_firm #block_possible .white_block span {
font-size: 14px;
}
#hy_accounting_firm #block_possible .green_block li {
display: inline-block;
width: 30%;
margin: 0 1%;
vertical-align: top;
}
#hy_accounting_firm #block_possible .green_block li img {
margin-bottom: 1em;
}
#hy_accounting_firm #block_possible .green_block p {
font-size: 12px;
line-height: 1.3;
}
#hy_accounting_firm #block_image .white_block h3 {
margin-bottom: 1em;
}
#hy_accounting_firm #block_example .white_block h3 {
margin-bottom: 1em;
}
#hy_accounting_firm #block_example .green_block {
height: 500px;
}
#hy_accounting_firm #block_example .green_block img {
max-height: 450px;
}
#hy_accounting_firm #block_image .green_block img {
max-height: 450px;
}
#hy_accounting_firm #block_costcut h2 {
margin-top: 8em;
margin-bottom: 5em;
font-weight: bold;
}
#hy_accounting_firm #block_price .white_block h3 {
margin-bottom: 1em;
}
#hy_accounting_firm #block_price .white_block p {
line-height: 1.3;
}
#hy_accounting_firm #block_price .green_block ul {
width: 90%;
display: inline-block;
}
#hy_accounting_firm #block_price .green_block li {
text-align: left;
margin-bottom: 0.5em;
}
#hy_accounting_firm #block_price .green_block li h4 {
border-radius: 5px;
padding: 0.3em 2em;
display: inline-block;
margin-right: 1em;
font-size: 16px;
font-weight: bold;
text-align: center;
}
#hy_accounting_firm #block_price .green_block li.initial h4 {
color: white;
background-color: #c60000;
}
#hy_accounting_firm #block_price .green_block li.monthly h4 {
border: 1px solid #000;
}
#hy_accounting_firm #block_price .green_block p {
font-size: 35px;
display: inline-block;
font-weight: bold;
vertical-align: middle;
margin-bottom: 0;
}
#hy_accounting_firm #block_price .green_block p span {
font-size: 20px;
}
#hy_accounting_firm #block_price .green_block li.initial p {
color: #c60000;
}
#hy_accounting_firm footer {
background-color: #030303;
padding: 4em 5%;
text-align: center;
color: white;
}
#hy_accounting_firm footer .link {
margin: 2em 0 1.5em;
}
#hy_accounting_firm footer a {
color: white;
text-decoration: none;
font-size: 12px;
}
#hy_accounting_firm footer p {
font-size: 12px;
margin: 0;
}
#hy_accounting_firm .btn_wrapper a {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
color: #fff;
background: #f13953;
width: 95%;
max-width: 450px;
margin: -60px auto 80px;
padding: 1em;
font-size: 17px;
}
@media screen and (max-width: 767px) {
#hy_accounting_firm .btn_wrapper a {
margin: -30px auto 80px;
font-size: 15px;
}
}
#hy_accounting_firm #block_video .video_wrapper {
padding: 0 2.5%;
}
#hy_accounting_firm #block_video .wp-video {
margin: 0 auto;
} #hy_faq dt {
position: relative;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/faq/q.png) left top no-repeat;
padding: 0 0 0 40px;
min-height: 40px;
line-height: 40px;
color: #cc0000;
font-size: 20px;
margin-bottom: 30px;
}
#hy_faq dt:before {
content: url(//help-you.me/wp1/wp-content/themes/hy/img/faq/q_img.png);
position: absolute;
left: -130px;
top: -10px;
}
#hy_faq dd {
position: relative;
margin-bottom: 100px;
}
#hy_faq dd:after {
content: url(//help-you.me/wp1/wp-content/themes/hy/img/faq/a_img.png);
position: absolute;
right: 30px;
top: 0;
}
#hy_faq dd p {
position: relative;
padding: 30px;
width: calc(100% - 170px);
background: #f9e5e6;
}
#hy_faq dd p:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 15px 0 15px 20px;
border-color: transparent transparent transparent #f9e5e6;
position: absolute;
top: calc(50% - 16px);
right: -20px;
} #hy_privacypolicy ul li h3,
#hy_rule ul li h3 {
font-size: 16px;
color: #cc0000;
margin: 2em auto 1em 0;
padding: 0;
}
#hy_rule ul li li {
margin-bottom: 0.5em;
} .hy_form table {
border: none;
max-width: 700px;
margin: 0 auto;
}
.hy_form table td,
.hy_form table th {
border: none;
}
.hy_form table th {
width: 30%;
font-weight: bold;
}
.hy_form table td .form-control,
.hy_form table th .form-control {
max-width: 100%;
}
.hy_form table table {
background: rgb(255, 250, 250);
}
.hy_form table table thead th {
background: rgb(255, 242, 242);
border-left: 5px solid #c00;
}
.hy_form .form-control {
border-radius: 0;
border: 1px solid #c00;
}
.hy_form .form-control.hide {
display: none;
}
.hy_form .wpcf7-date {
border-radius: 0;
border: 1px solid #c00;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
}
.hy_form label span {
white-space: nowrap;
display: inline-block;
}
.hy_form label span.wpcf7-list-item-label {
margin-left: 0.3em;
}
span.required_asterisk {
color: #c00;
font-size: 80%;
margin-left: 1em;
}
span.required_asterisk:before {
content: "※";
}
span.norequired {
font-size: 80%;
margin-left: 1em;
}
.hy_form .wpcf7-not-valid-tip {
font-weight: bold;
color: #fff;
background: #f00;
margin: 5px;
padding: 5px;
}
#questions_710537_year,
#questions_710537_month,
#questions_710537_day,
.hy_form select[id$="_year"].form-control,
.hy_form select[id$="_month"].form-control,
.hy_form select[id$="_day"].form-control {
max-width: calc((100% - 5.5em) / 3);
display: inline-block;
vertical-align: bottom;
margin: 0 0.5em;
}
#questions_710537_year,
.hy_form select[id$="_year"].form-control {
margin-left: 0;
}
.hy_form .notes {
margin: 50px auto 75px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#post-12762 .hy_form .notes {
justify-content: center;
}
.hy_form .notes h2 {
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
width: 100%;
}
.hy_form .notes > div {
background: #f9e5e6;
width: 48%;
padding: 15px;
margin-bottom: 50px;
}
.hy_form .notes h3 {
color: #cc0000;
font-size: 24px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
}
.hy_form span.wpcf7-list-item {
display: block;
}
.hy_form #your-reason {
display: flex;
flex-wrap: wrap;
}
.hy_form #your-reason span.wpcf7-list-item {
width: calc((100% - 2em) / 2);
min-width: 155px;
}
.hy_form div.wpcf7 .ajax-loader {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%);
}
.wpcf7 .privacy {
margin-top: 50px;
text-align: left;
margin: 50px auto;
}
.wpcf7 .privacy .heading {
font-weight: bold;
text-align: center;
}
.wpcf7 .privacy dl {
height: 200px;
overflow: auto;
border: 1px solid #ccc;
padding: 1em;
}
.wpcf7 .privacy dt {
border: none;
font-size: 15px;
}
.wpcf7 .privacy dd {
border: none;
padding-left: 2em;
font-size: 13px;
}
.wpcf7 .privacy .wpcf7-form-control-wrap.agree,
.wpcf7 .privacy .wpcf7-form-control-wrap.agree2 {
text-align: center;
display: block;
}
#wpcf7-f11078-p11333-o1 .wpcf7-list-item {
display: block;
}
#wpcf7-f11078-p11333-o1 th {
width: 20%;
min-width: 100px;
}
#wpcf7-f11078-p11333-o1 .wpcf7-free-text.form-control {
display: inline-block;
width: 50%;
margin-left: 10px;
}
@media screen and (max-width: 767px) {
.hy_form table th {
width: 100%;
display: block;
}
.hy_form table th label {
margin-bottom: 0;
}
.hy_form table td {
width: 100%;
display: block;
padding-top: 0;
}
}
@media screen and (max-width: 991px) {
#hy_top #block01 .block01_title_1 {
padding-left: 15px;
}
#hy_top #block01 .block01_video .bg-red {
padding: 100px calc(50vw - 325px) 100px 0;
margin-right: calc(325px - 50vw);
}
#hy_top #block02 ul li {
padding: 270px 0 0 0;
}
#hy_top #block02 ul li h3 {
font-size: 18px;
}
#hy_top #block02 ul li:nth-child(1) h3,
#hy_top #block02 ul li:nth-child(2) h3,
#hy_top #block02 ul li:nth-child(3) h3 {
background-size: 70px;
padding-left: 70px;
}
#hy_top #block03 h3 {
font-size: 20px;
}
#hy_top #block03 .illust_goriyou {
height: 90vw;
}
#hy_top #block04 h2 {
}
#hy_top #block04 ul li {
padding: 180px 0 0;
}
#hy_top #block06 .block06_img {
width: 40%;
}
#hy_top #block06 .block06_txt {
width: 57%;
}
#hy_top #block07 ul li {
margin: 0px;
}
#hy_top_2019 #block01 {
background: #cb0000 url(//help-you.me/wp1/wp-content/themes/hy/img/top_2019/mv.png) left 50vw top no-repeat;
padding-top: 60px;
padding-bottom: 100px;
background-size: auto 100%;
}
#hy_top_2019 #block01 a.mv_link_button,
#hy_top_2019 #block01 a.mv_link_button2 {
background: #fff;
background-size: 50px;
padding: 0 20px 0 20px;
left: auto;
right: 0;
border-radius: 20px 0 0 20px;
height: 60px;
box-shadow: 0 0px 5px rgba(0, 0, 0, 0.2);
}
#hy_top_2019 #block01 a.mv_link_button {
bottom: 20px;
}
#hy_top_2019 #block01 a.mv_link_button2 {
bottom: 90px;
}
#hy_top_2019 #block01 a.mv_link_button p,
#hy_top_2019 #block01 a.mv_link_button2 p {
font-size: 20px;
line-height: 1em;
}
#hy_top_2019 #block03 ul li h3 {
font-size: 22px;
}
#hy_top_2019 #block05 h3 {
font-size: 18px;
}
#hy_top_2019 #block05 a div p {
font-size: 20px;
}
#hy_top_2019 #block05 a div .name {
font-size: 12px;
}
#hy_top_2019 #block05 .block05_1 a p {
font-size: 16px;
}
#hy_top_2019 #block06 .block06_1 li {
width: calc((100% - 40px) / 3);
font-size: 18px;
}
#hy_top_2019 #block10 .illust_goriyou {
background-size: 80% auto;
}
#hy_top_2019 .block_team li {
width: calc((100% - 40px) / 3);
font-size: 18px;
}
#hy_about .block01_1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/01_map.png) center bottom no-repeat;
background-size: calc(100% - 30px);
height: calc(100vw + 200px);
}
#hy_about .block01_1 .block01_1_1 {
padding-left: 15px;
}
#hy_about .block01_2 h3 {
padding: 0.7em 3em 0.7em 1em;
}
#hy_about h3.sec_ttl {
padding: 0.7em 3em 0.7em 1em;
}
#hy_about .block01_2 .block01_2_1 div {
padding: 10px;
width: 15%;
}
#hy_about .block01_2 .block01_2_1 div:after {
border-width: 10px 0 10px 10px;
right: -12%;
}
#hy_about .block01_2 h4 {
padding: 0;
}
#hy_about .block01_3 h3 {
padding: 0.7em 3em 0.7em 1em;
}
#hy_about .block02_1 .bg-red {
padding: 100px 0 100px calc(50vw - 325px);
margin-left: calc(325px - 50vw);
}
#hy_about .block02_1 .block02_1_2 {
padding-left: 15px;
}
#hy_about .block02_2 .block02_2_1 {
height: 750px;
}
#hy_about .block02_4 h3 {
padding: 0.5em 3em 0.5em 1em;
}
#hy_about .block03_1 .block03_1_1 {
padding-left: 15px;
}
#hy_about .block03_1 .bg-red {
padding: 100px calc(50vw - 325px) 100px 0;
margin-right: calc(325px - 50vw);
}
#hy_about .block03_2 h4 {
padding: 0.5em 3em 0.5em 1em;
}
#hy_about .block03_2 .block03_2_3 a.link_button {
width: 100%;
}
#hy_usage #block01 h2,
#hy_usage #block02 h2,
#hy_usage #block03 h2 {
padding: 1em 3em 1em 1em;
font-size: 26px;
position: static;
}
#hy_usage #block01 ul.row li a {
height: 240px;
padding-top: 150px;
max-width: 160px;
}
#hy_usage #block02 .block02_1_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/katsuyoujirei_01_sp.png) center top no-repeat;
background-size: contain;
padding: 70px;
height: 300px;
}
#hy_usage #block02 .block02_2_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/katsuyoujirei_02_sp.png) center top no-repeat;
background-size: contain;
padding: 70px;
height: 300px;
}
#hy_usage #block02 .block02_3_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/usage/katsuyoujirei_03_sp.png) center top no-repeat;
background-size: contain;
padding: 70px;
height: 300px;
}
#hy_usage #block02 .block02_1_2 h4,
#hy_usage #block02 .block02_2_2 h4,
#hy_usage #block02 .block02_3_2 h4 {
margin: 5px 0 1em 50%;
}
#hy_usage #block02 .block02_1_2 p,
#hy_usage #block02 .block02_2_2 p,
#hy_usage #block02 .block02_3_2 p {
width: 350px;
margin: 0 auto;
}
#hy_usage #block03 .block03_1,
#hy_usage #block03 .block03_2,
#hy_usage #block03 .block03_3 {
height: calc(100vw / 3);
}
#hy_usage #block03 p {
font-size: 13px;
}
#hy_sample #block01 h2,
#hy_sample #block02 h2 {
padding: 0.5em 3em 0.5em 1em;
}
#hy_sample #block01 .block01_2 {
height: 1080px;
}
#hy_sample #block02 .img {
height: 150px;
}
#hy_faq dd:after {
right: 0;
top: 0;
}
#hy_faq dd p {
width: calc(100% - 140px);
}
#hy_price #block01 .block01_1 .row > div,
#hy_price #block01 .block01_2 .row > div {
padding: 200px 30px 10px;
height: 370px;
}
#hy_price #block01 .block01_1 .row > div p.price,
#hy_price #block01 .block01_2 .row > div p.price {
font-size: 30px;
margin-bottom: 0.2em;
}
#hy_price #block01 .block01_1 .row > div p,
#hy_price #block01 .block01_2 .row > div p {
height: 40px;
line-height: 1.3em;
font-size: 13px;
}
#hy_price #block01 .block01_1 a,
#hy_price #block01 .block01_2 a {
padding: 0.5em;
}
#hy_price #block02 h2 {
padding: 0.7em 3em 0.7em 1em;
}
#hy_case #block02 .block02_2 li a .imgblock {
height: 135px;
}
#hy_oflinelp #block01 .block01_1 .row > div,
#hy_oflinelp #block01 .block01_2 .row > div {
padding: 200px 30px 10px;
height: 370px;
}
#hy_oflinelp #block01 .block01_1 .row > div p.price,
#hy_oflinelp #block01 .block01_2 .row > div p.price {
font-size: 30px;
margin-bottom: 0.2em;
}
#hy_oflinelp #block01 .block01_1 .row > div p,
#hy_oflinelp #block01 .block01_2 .row > div p {
height: 40px;
line-height: 1.3em;
font-size: 13px;
}
#hy_oflinelp #block01 .block01_1 a,
#hy_oflinelp #block01 .block01_2 a {
padding: 0.5em;
}
#hy_oflinelp #block02 h2 {
padding: 0.7em 3em 0.7em 1em;
}
#hy_storeowner #block_mv {
height: 400px;
}
#hy_storeowner #block_mv .text {
height: 400px;
}
#hy_storeowner .outside_block .point {
position: relative;
top: 0;
left: calc(50% - 60px);
margin-bottom: 2em;
}
#hy_storeowner #block08 ul {
display: flex;
flex-direction: column;
}
#hy_storeowner #block08 li {
width: 100%;
margin: 30px auto;
}
#hy_storeowner #block08 li:nth-child(1):after,
#hy_storeowner #block08 li:nth-child(2):after {
border-width: 20px 20px 0 20px;
border-color: #cc0000 transparent transparent transparent;
top: auto;
right: calc(50% - 20px);
bottom: -40px;
}
#hy_storeowner #block08 li:nth-child(1) div p.description,
#hy_storeowner #block08 li:nth-child(2) div p.description,
#hy_storeowner #block08 li:nth-child(3) div p.description {
background-size: auto 100px;
}
#hy_storeowner #block08 .link_button {
margin-top: 10px;
}
#hy_storeowner #block08 .title {
display: inline-block;
}
#hy_storeowner #block08 .title h3 {
min-width: 170px;
}
body.page-id-6190 .siteContent {
padding-top: 2.5em;
}
#hy_accounting_firm header {
margin-top: 1em;
}
#hy_accounting_firm #block_mv .row {
margin-left: 0;
margin-right: 0;
}
#hy_accounting_firm #block_mv h4 {
font-size: 13px;
}
#hy_accounting_firm #block_mv h1 {
font-size: 32px;
}
#hy_accounting_firm #block_mv h3 {
font-size: 16px;
}
#hy_accounting_firm #block_mv p {
background-size: 12px;
padding: 0 22px;
}
#hy_accounting_firm .white_block {
width: 80%;
}
#hy_accounting_firm .white_block.forSP {
display: inline-flex;
}
#hy_accounting_firm .white_block.forPC {
display: none;
}
#hy_accounting_firm .green_block {
width: 95%;
}
#hy_accounting_firm #block_example .green_block img {
max-height: 450px;
margin: 2em 0;
}
#hy_accounting_firm #block_image .green_block img {
max-height: 400px;
}
#hy_accounting_firm #block_price .green_block ul {
width: auto;
}
}
@media screen and (min-width: 768px) {
.home .siteContent {
padding: 0 0 3.5em;
}
}
@media screen and (max-width: 767px) {
#hy_top #block01 .block01_video .bg-red {
padding: 30px 30px 30px 0;
margin-right: -30px;
}
#hy_top #block01 .block01_title_1 {
padding-left: 38px;
}
.entry-body #hy_top .block01_title a.link_button {
width: 100%;
}
#hy_top #block02 ul li {
padding: 110vw 0 0 0;
}
#hy_top #block02 ul li:nth-child(1) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/3values_sp_01.jpg) center top no-repeat;
background-size: calc(100% - 30px);
}
#hy_top #block02 ul li:nth-child(2) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/3values_sp_02.jpg) center top no-repeat;
background-size: calc(100% - 30px);
}
#hy_top #block02 ul li:nth-child(3) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/3values_sp_03.jpg) center top no-repeat;
background-size: calc(100% - 30px);
}
#hy_top #block02 ul li h3 {
width: calc(100% - 30px);
}
#hy_top #block02 ul li:nth-child(1) h3,
#hy_top #block02 ul li:nth-child(2) h3,
#hy_top #block02 ul li:nth-child(3) h3 {
background-size: auto;
padding-left: 90px;
}
#hy_top #block02 ul li p {
width: calc(100% - 30px);
}
#hy_top #block03 .assistant_l_01,
#hy_top #block03 .assistant_r_02 {
height: 44vw;
}
#hy_top #block03 .illust_goriyou {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/illust_goriyou.gif) center top no-repeat;
width: calc(100% - 30px);
height: 50vw;
max-height: none;
background-size: contain;
margin: 0 auto;
}
#hy_top #block04 h2 {
}
#hy_top #block04 ul {
justify-content: center;
}
#hy_top #block04 ul li {
padding: 35vw 0 0;
height: 60vw;
width: 40%;
}
#hy_top #block04 ul li p {
font-size: 14px;
}
#hy_top #block05 .row > div.pc {
display: none;
}
#hy_top #block07 ul li {
margin: 5px;
}
#hy_top #block08 li div p.step {
width: auto;
}
#hy_top #block08 ul {
display: flex;
flex-direction: column;
}
#hy_top #block08 li {
width: 100%;
margin: 30px auto;
}
#hy_top #block08 li:nth-child(1):after,
#hy_top #block08 li:nth-child(2):after {
border-width: 20px 20px 0 20px;
border-color: #cc0000 transparent transparent transparent;
top: auto;
right: calc(50% - 20px);
bottom: -40px;
}
#hy_top #block08 li:nth-child(1) div p.description,
#hy_top #block08 li:nth-child(2) div p.description,
#hy_top #block08 li:nth-child(3) div p.description {
background-size: auto 100px;
}
#hy_top #block08 .link_button {
margin-top: 10px;
}
#hy_top #block09 ul li {
padding: 10px;
}
#hy_top #block10 ul li {
padding: 10px;
}
#hy_top_2019 #block01 p {
line-height: 1.5;
margin-bottom: 3em;
}
#hy_top_2019 h2 {
font-size: 22px;
}
#hy_top_2019 #block10 h3 {
font-size: 15px;
}
#hy_top_2019 #block10 .illust_goriyou {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/illust_goriyou.gif) center top no-repeat;
width: calc(100% - 30px);
height: 50vw;
max-height: none;
background-size: contain;
margin: 0 auto;
}
#hy_top_2019 #block02 ul {
justify-content: center;
}
#hy_top_2019 #block02 ul li {
width: 50%;
padding: 190px 0 0;
height: 350px;
background-size: auto;
}
#hy_top_2019 #block03 ul {
justify-content: center;
}
#hy_top_2019 #block03 ul li {
width: 300px;
margin-bottom: 30px;
}
#hy_top_2019 #block03 ul li:before {
border-width: 40px 40px 0 40px;
border-color: #fff transparent transparent transparent;
top: auto;
bottom: -5px;
right: 50%;
transform: translate(50%, 100%);
}
#hy_top_2019 #block03 ul li:after {
border-width: 40px 40px 0 40px;
border-color: #cb0000 transparent transparent transparent;
top: auto;
bottom: 0;
right: 50%;
transform: translate(50%, 100%);
}
#hy_top_2019 #block04 ul li:first-child {
margin-bottom: 30px;
}
#hy_top_2019 .block04_3 {
width: 80%;
margin: 25px auto;
}
#hy_top_2019 #block04 ul {
justify-content: center;
}
#hy_top_2019 #block04 ul li {
width: 300px;
margin-bottom: 30px;
}
#hy_top_2019 #block04 ul li.block04_7 {
margin-top: 30px;
}
#hy_top_2019 #block04 .block04_9 {
width: 300px;
margin: 0 auto;
}
#hy_top_2019 #block04 .block04_9:before {
top: 0;
left: 50%;
transform: translate(-50%, -30px);
width: 100px;
height: 50px;
}
#hy_top_2019 #block04 .block04_9:after {
top: 0;
left: 50%;
transform: translate(-50%, -30px);
}
#hy_top_2019 #block04 .block04_9 .block04_title {
width: 100%;
margin-top: 15px;
}
#hy_top_2019 #block04 .block04_9_2 {
width: 100%;
text-align: center;
padding: 15px;
}
#hy_top_2019 #block04 .block04_9 .description {
line-height: 1.3em;
}
#hy_top_2019 #block04 .link_button {
max-width: 80%;
}
#hy_top_2019 #block04 .block04_9 .filter:after {
top: -50px;
width: 200px;
}
#hy_top_2019 #block04 h2 { }
#hy_top_2019 #block04 ul li.block04_11:after {
transform: translate(-20%, -75%);
width: 100%;
height: 200px;
}
#hy_top_2019 #block05 a {
width: 319px;
margin: 0 auto;
}
#hy_top_2019 #block05 a {
max-width: 319px;
margin: 0 auto 40px;
}
#hy_top_2019 #block05 h3 {
margin-bottom: 10px;
}
#hy_top_2019 #block05 a div {
text-align: center;
}
#hy_top_2019 #block06 .block06_1 {
padding: 20px;
}
#hy_top_2019 #block06 .block06_1 h3 {
background-size: auto;
padding: 40px 10px 135px;
}
#hy_top_2019 #block06 .block06_1 ul {
justify-content: center;
flex-wrap: wrap;
}
#hy_top_2019 #block06 .block06_1 li {
width: 80%;
margin-bottom: 30px;
}
#hy_top_2019 #block06 .block06_1 li:last-child {
margin-bottom: 0;
}
#hy_top_2019 #block08 p {
font-size: 18px;
}
#hy_top_2019 #block08 li {
text-align: center;
margin: 0 auto 30px;
}
#hy_top_2019 #block08 .link_button {
max-width: 80%;
}
#hy_top_2019 .block_team {
padding: 20px;
}
#hy_top_2019 .block_team h3 {
background-size: auto;
padding: 40px 10px 135px;
}
#hy_top_2019 .block_team ul {
justify-content: center;
flex-wrap: wrap;
}
#hy_top_2019 .block_team li {
width: 80%;
margin-bottom: 30px;
}
#hy_top_2019 .block_team li:last-child {
margin-bottom: 0;
}
#hy_top_2019 #block11 p {
font-size: 18px;
}
#hy_top_2019 #block11 ul li {
padding: 10px;
}
#hy_top_2019 #block_faq{
margin: 50px auto -80px;
padding: 50px 0;
}
#hy_top_2019 #block_faq .faq_question{
font-size: 14px;
}
#hy_top_2019 #block_faq .faq_accordion_item:checked + .faq_question + .faq_answer{
font-size: 13px;
}
#hy_top_2019 #block_faq .faq_question::before,
#hy_top_2019 #block_faq .faq_question::after{
right: 10px;
width: 10px;
}
#hy_about .block01_1 .block01_1_1 {
margin-left: 15px;
}
#hy_about .block01_2 .block01_2_1 {
flex-direction: column;
}
#hy_about .block01_2 .block01_2_1 div {
width: 100%;
margin-bottom: 30px;
}
#hy_about .block01_2 .block01_2_1 div.process_item {
width: 100%;
}
#hy_about .block01_2 .block01_2_1 div:after {
transform: rotate(90deg);
right: calc(50% - 5px);
top: auto;
bottom: -25px;
}
#hy_about .block01_3 .block01_3_1 div {
width: 100%;
}
#hy_about .block01_3 .block01_3_1 div:nth-child(3) {
margin-bottom: 150px;
}
#hy_about .block02_1 .block02_1_2 {
margin-left: 15px;
margin-top: 15px;
}
#hy_about .block02_1 .bg-red {
padding: 30px 0 30px 30px;
margin-left: -30px;
text-align: center;
}
#hy_about .block02_2 .block02_2_1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/illust_jyoucyousei_sp.gif) center top no-repeat;
background-size: calc(100% - 30px);
height: 300vw;
}
#hy_about .block02_4 .block02_4_1 > div {
width: 100%;
margin-bottom: 50px;
}
#hy_about .block02_4 .block02_4_1 > div:last-child {
margin-bottom: 0;
}
#hy_about .block02_4 .block02_4_1 > div li {
width: 80%;
}
#hy_about .block02_4 .block02_4_1 .block02_4_1_1 li:nth-child(1) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/img_skillup_sp.jpg) center top no-repeat;
background-size: contain;
height: 110vw;
}
#hy_about .block02_4 .block02_4_1 .block02_4_1_2 li:nth-child(1) {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/img_feedback_sp.jpg) center top no-repeat;
background-size: contain;
height: 110vw;
}
#hy_about .block03_1 .bg-red {
padding: 30px 30px 30px 0;
margin-right: -30px;
text-align: center;
}
#hy_about .block03_1 .block03_1_1 {
margin-left: 15px;
}
#hy_about .block03_2 .block03_2_1 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/about/flow_sp.gif) center top no-repeat;
background-size: calc(100% - 30px);
height: 55vw;
}
#hy_about .block03_2 .block03_2_3 .block03_2_3_1 {
flex-direction: column;
}
#hy_about .block03_2 .block03_2_3 .block03_2_3_1 > div {
width: 100%;
margin-bottom: 30px;
}
#hy_about .block02_3 .block02_3_1 .table_comparison th{
padding: 0.5em;
font-size: 14px;
border-width: 2px;
}
#hy_about .block02_3 .block02_3_1 .table_comparison td{
padding: 0.5em;
font-size: 12px;
border-width: 2px;
}
#hy_about .block02_3 .block02_3_1 td span{
font-size: 30px;
}
#hy_about .block02_3 .block02_3_1 .table_comparison td{
width: 25%;
}
#hy_about .block02_3 .block02_3_1 .table_comparison .item_ttl{
width: 25%;
min-width: 6.5em;
}
#hy_usage #block01 {
padding-bottom: 50px;
}
#hy_usage #block01 h2,
#hy_usage #block02 h2,
#hy_usage #block03 h2 {
padding: 0.5em 1em 0.5em 15px;
font-size: 6.8vw;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li p {
font-size: 3vw;
}
#hy_usage #block01 ul.ChangeElem_Btn_Content li {
padding: 0 0 20vw;
height: 25vw;
}
#hy_usage #block01 ul > li.ChangeElem_Panel {
padding: 20px;
}
#hy_usage #block01 ul > li.ChangeElem_Panel.is-active {
display: flex;
flex-direction: column;
}
#hy_usage #block01 ul.row li a {
height: 250px;
padding-top: 200px;
}
#hy_usage #block02 {
margin-top: -25px;
}
#hy_usage #block02 h2 {
margin-bottom: 2em;
}
#hy_usage #block02 .block02_1_1,
#hy_usage #block02 .block02_2_1,
#hy_usage #block02 .block02_3_1 {
margin-left: 15px;
padding-left: 15px;
}
#hy_usage #block02 .block02_1_2,
#hy_usage #block02 .block02_2_2,
#hy_usage #block02 .block02_3_2 {
margin: 0 auto;
}
#hy_usage #block03 .row-eq-height {
flex-direction: column;
}
#hy_usage #block03 h2 {
margin-bottom: 1em;
position: static;
}
#hy_usage #block03 .block03_1,
#hy_usage #block03 .block03_2,
#hy_usage #block03 .block03_3 {
height: calc(100vw - 30px);
width: 100%;
margin-bottom: 15px;
}
#hy_usage #block03 h3 {
margin-left: 30px;
font-size: 18px;
}
#hy_usage #block03 p {
width: calc(100vw - 30px);
font-size: 4.8vw;
}
#hy_sample #block01 .block01_1_2 {
margin: 0 15px;
}
#hy_sample #block01 .block01_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/before_after/flow_ba_sp.gif) center bottom no-repeat;
background-size: calc(100% - 30px);
height: 330vw;
}
#hy_sample #block02 .block02_1,
#hy_sample #block02 .block02_2,
#hy_sample #block02 .block02_3,
#hy_sample #block02 .block02_4 {
width: 100%;
margin-bottom: 50px;
}
#hy_price #block01 .block01_1 {
display: none;
}
#hy_price #block01 .block01_2 {
display: block;
margin-bottom: 50px;
}
#hy_price #block01 .block01_2 .row > div {
padding: 60vw 10px 10px;
height: 96vw;
}
#hy_price #block01 .block01_2 .row > div {
padding: 60vw 10px 10px;
}
#hy_price #block01 .block01_2 .row > div.block01_2_1,
#hy_price #block01 .block01_2 .row > div.block01_2_2 {
height: 83vw;
padding: 46vw 10px 10px;
}
#hy_price #block01 .block01_3 h3 {
width: 100%;
text-align: center;
line-height: 1.3em;
}
#hy_price #block01 .block01_3 h3 span {
display: inline-block;
}
#hy_price #block01 .block01_3 h3:after {
display: none;
}
#hy_price #block01 .block01_3 h4 {
text-align: center;
line-height: 1.3em;
}
#hy_price #block01 .block01_3 h4 span {
display: inline-block;
}
#hy_price #block02 h2 {
font-size: 20px;
}
#hy_price #block02 h3 {
margin-bottom: 0;
}
#hy_price #block02 .block02_1 .block02_1_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/price/graf_01_sp.gif) center top no-repeat;
background-size: contain;
width: 100%;
height: 200vw;
}
#hy_price #block02 .block02_2 .block02_2_2 {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/price/graf_02_sp.gif) center top no-repeat;
background-size: contain;
width: 100%;
height: 250vw;
}
#hy_oflinelp #block02 .btn-lg {
width: 70vw;
}
#hy_oflinelp #block01 h2,
#hy_oflinelp #block03 h2,
#hy_oflinelp #block04 h2,
#hy_oflinelp #block05 h2,
#hy_oflinelp #block06 h2,
#hy_oflinelp #block08 h2 {
font-size: 22px;
}
#hy_oflinelp #block01 .block01_1 {
display: none;
}
#hy_oflinelp #block01 .block01_2 {
display: block;
margin-bottom: 50px;
}
#hy_oflinelp #block01 .block01_2 .row > div {
padding: 60vw 10px 10px;
height: 96vw;
}
#hy_oflinelp #block01 .block01_2 .row > div {
padding: 60vw 10px 10px;
}
#hy_oflinelp #block01 .block01_2 .row > div.block01_2_1,
#hy_oflinelp #block01 .block01_2 .row > div.block01_2_2 {
height: 83vw;
padding: 46vw 10px 10px;
}
#hy_oflinelp #block01 .block01_3 h3 {
width: 100%;
text-align: center;
line-height: 1.3em;
}
#hy_oflinelp #block01 .block01_3 h3 span {
display: inline-block;
}
#hy_oflinelp #block01 .block01_3 h3:after {
display: none;
}
#hy_oflinelp #block01 .block01_3 h4 {
text-align: center;
line-height: 1.3em;
}
#hy_oflinelp #block01 .block01_3 h4 span {
display: inline-block;
}
#hy_oflinelp #block08 li div p.step {
width: auto;
}
#hy_oflinelp #block08 ul {
display: flex;
flex-direction: column;
}
#hy_oflinelp #block08 li {
width: 100%;
margin: 30px auto;
}
#hy_oflinelp #block08 li:nth-child(1):after,
#hy_oflinelp #block08 li:nth-child(2):after {
border-width: 20px 20px 0 20px;
border-color: #cc0000 transparent transparent transparent;
top: auto;
right: calc(50% - 20px);
bottom: -40px;
}
#hy_oflinelp #block08 li:nth-child(1) div p.description,
#hy_oflinelp #block08 li:nth-child(2) div p.description,
#hy_oflinelp #block08 li:nth-child(3) div p.description {
background-size: auto 100px;
}
#hy_oflinelp #block08 .link_button {
margin-top: 10px;
}
#hy_faq dt {
margin-left: 13vw;
}
#hy_faq dt:before {
content: "";
background: url(//help-you.me/wp1/wp-content/themes/hy/img/faq/q_img.png) left center no-repeat;
background-size: contain;
width: 10vw;
height: 20vw;
left: -13vw;
top: calc(50% - 10vw);
}
#hy_faq dd:after {
content: "";
background: url(//help-you.me/wp1/wp-content/themes/hy/img/faq/a_img.png) right center no-repeat;
background-size: contain;
width: 10vw;
height: 20vw;
top: calc(50% - 10vw);
}
#hy_faq dd p {
padding: 15px;
width: calc(100% - 13vw);
}
#hy_faq dd p:after {
border-width: 10px 0 10px 15px;
top: calc(50% - 8px);
right: -10px;
}
.hy_form .notes {
margin: 100px auto 50px;
flex-direction: column;
}
.hy_form .notes > div {
width: 100%;
margin-bottom: 30px;
}
#hy_storeowner {
margin-top: 0em;
}
#hy_storeowner #block_mv {
height: 300px;
}
#hy_storeowner #block_mv .text {
height: 300px;
left: 0;
}
#hy_storeowner .contact .btn-lg {
width: 70vw;
font-size: 1.25rem;
}
#hy_storeowner .black_arrow {
border-top: solid 35px #222222;
border-right: solid 60px transparent;
border-bottom: solid 35px transparent;
border-left: solid 60px transparent;
}
#hy_storeowner .black_block h5 {
font-size: 18px;
}
#hy_storeowner .black_block h4 {
font-size: 24px;
}
#hy_storeowner ul,
#hy_storeowner #block_expert ul,
#hy_storeowner #block_compare ul {
text-align: center;
}
#hy_storeowner li.itemblock,
#hy_storeowner #block_expert li.itemblock,
#hy_storeowner #block_compare li.itemblock {
width: 90%;
max-width: 350px;
margin-bottom: 4em;
text-align: left;
}
#hy_storeowner li.itemblock .bottom p,
#hy_storeowner #block_expert li.itemblock .bottom p,
#hy_storeowner #block_compare li.itemblock .bottom p {
height: auto;
}
#hy_storeowner #block_support li:before {
left: -3%;
}
#hy_storeowner .outside_block h2 {
font-size: 20px;
}
#hy_storeowner #block_online li {
width: 25%;
}
#hy_storeowner #block_online li img {
margin-bottom: 0.5em;
}
#hy_storeowner #block_online li p {
font-size: 12px;
}
#hy_storeowner #block_online .inside_block li {
width: 27.77%;
margin: 0 1.11%;
}
#hy_storeowner .outside_block h4.underline {
font-size: 15px;
}
#hy_storeowner .outside_block .point {
width: 100px;
left: calc(50% - 50px);
}
#hy_storeowner #block_example .pc_img {
display: none;
}
#hy_storeowner #block_example .sp_img {
display: block;
}
#hy_storeowner #block_price h2 {
font-size: 20px;
}
#hy_storeowner #block_price ul {
padding: 0 5%;
}
#hy_storeowner #block_price li h4 {
font-size: 14px;
}
#hy_storeowner #block_price p {
font-size: 28px;
}
#hy_storeowner #block_price p span {
font-size: 18px;
}
#hy_storeowner #block08 li div p.step {
width: auto;
}
#hy_accounting_firm #block_mv {
height: auto;
margin-bottom: 60px;
}
#hy_accounting_firm #block_mv .row {
background-image: none;
text-align: center;
}
#hy_accounting_firm #block_mv .text {
text-align: center;
}
#hy_accounting_firm #block_mv .text h1,
#hy_accounting_firm #block_mv .text h3,
#hy_accounting_firm #block_mv .text h4,
#hy_accounting_firm #block_mv .text p {
text-align: left;
}
#hy_accounting_firm #block_mv .text .forPC {
display: none;
}
#hy_accounting_firm #block_mv .forSP {
display: block;
text-align: center;
}
#hy_accounting_firm #block_mv .forSP img {
max-width: 400px;
width: 100%;
}
#hy_accounting_firm section {
margin-bottom: 60px;
}
}
@media screen and (max-width: 500px) {
#hy_accounting_firm #block_mv .text .forPC {
display: block;
}
}
@media screen and (max-width: 479px) {
#hy_top #block01 .block01_title_1 {
padding-left: 15px;
}
.entry-body #hy_top .block01_title_1 h1 {
margin-top: 50px;
font-size: 24px;
}
.entry-body #hy_top .block01_title_1 h2 br {
display: none;
}
#hy_top #block02 h2,
#hy_top #block03 h2,
#hy_top #block04 h2,
#hy_top #block05 h2,
#hy_top #block06 h2,
#hy_top #block07 h2,
#hy_top #block08 h2,
#hy_top #block09 h2,
#hy_top #block10 h2 {
font-size: 22px;
}
#hy_top #block04 {
}
#hy_top #block04 ul li {
width: 50%;
padding: 45vw 0 0;
height: 350px;
}
#hy_top #block06 .block06_1,
#hy_top #block06 .block06_2 {
flex-direction: column;
}
#hy_top #block06 .block06_img {
width: 100%;
text-align: center;
margin-bottom: 15px;
}
#hy_top #block06 .block06_txt {
width: 100%;
margin-left: 0;
}
#hy_top #block09 ul li {
width: 50%;
margin-bottom: -15vw;
}
#hy_top #block10 ul li {
width: 50%;
height: 90px;
}
#hy_top #block10 ul li img {
max-width: 100%;
}
#hy_top_2019 #block01 a {
background-size: 40px;
padding: 0 60px 0 20px;
border-radius: 10px 0 0 10px;
}
#hy_top_2019 #block02 ul li {
background-size: contain;
}
#hy_top_2019 #block11 ul {
margin-bottom: 10vw;
}
#hy_top_2019 #block11 ul li {
width: 50%;
margin: 0 0 -15vw;
}
#hy_about .block01_1 {
height: calc(100vw + 300px);
}
#hy_about .block01_1 .block01_1_1 p br {
display: none;
}
#hy_about .block01_2 h3 {
font-size: 20px;
}
#hy_about h3.sec_ttl{
font-size: 20px;
}
#hy_about .block01_3 h3 {
font-size: 20px;
}
#hy_about .block02_3 .block02_3_1 th {
padding: 0.5em;
}
#hy_about .block02_3 .block02_3_1 td {
padding: 0.5em;
}
#hy_about .block02_4 h3 {
font-size: 20px;
}
#hy_about .block03_2 h4 {
font-size: 20px;
}
#hy_about .block03_2 .block03_2_2 {
flex-direction: column;
}
#hy_about .block03_2 .block03_2_2 > div:first-child {
width: 100%;
margin-bottom: 30px;
}
#hy_about .block03_2 .block03_2_2 > div:nth-child(2) {
width: 100%;
height: 300px;
}
#hy_about .block03_2 .block03_2_2 p:after {
transform: rotate(90deg);
right: calc(50% - 10px);
top: auto;
bottom: -20px;
}
#hy_about #block_strength .strength_list_item h3{
font-size: 1.2rem;
}
#hy_about .block02_3 .block02_3_1 .table_comparison th{
font-size: 12px;
}
#hy_about .block02_3 .block02_3_1 .table_comparison td{
font-size: 10px;
}
#hy_about .block02_3 .block02_3_1 td span{
font-size: 20px;
}
#hy_usage #block01 ul.row li a {
height: 60vw;
padding-top: 40vw;
max-width: none;
font-size: 4.5vw;
}
.modal_inner h3 {
width: 50vw;
height: 60vw;
padding-top: 50vw;
font-size: 5.8vw;
margin-top: 0;
}
.modal_inner p {
margin-bottom: 0;
line-height: 1.5em;
font-size: 14px;
}
#usage01 h3,
#usage02 h3,
#usage03 h3,
#usage04 h3,
#usage05 h3,
#usage06 h3,
#usage07 h3,
#usage08 h3,
#usage09 h3,
#usage10 h3 {
background-size: contain;
}
#hy_usage #block02 .block02_1_2,
#hy_usage #block02 .block02_2_2,
#hy_usage #block02 .block02_3_2 {
padding: 12vw 5vw;
height: 70vw;
width: 90vw;
margin: 0 auto;
}
#hy_usage #block02 .block02_1_2 h4,
#hy_usage #block02 .block02_2_2 h4,
#hy_usage #block02 .block02_3_2 h4 {
height: 20vw;
}
#hy_usage #block02 .block02_1_2 p,
#hy_usage #block02 .block02_2_2 p,
#hy_usage #block02 .block02_3_2 p {
width: 100%;
font-size: 4vw;
line-height: 1.1em;
}
#hy_sample #block01 h2,
#hy_sample #block02 h2 {
font-size: 20px;
}
#hy_price #block01 .block01_2 .row > div.block01_2_1,
#hy_price #block01 .block01_2 .row > div.block01_2_2 {
padding: 35vw 40px 10px;
margin-bottom: 40px;
}
#hy_price #block01 .block01_2 .row > div p.price {
font-size: 24px;
}
#hy_price #block01 .block01_2 a {
width: 100%;
}
#hy_price #block01 .block01_2 .row > div {
padding: 48vw 40px 10px;
}
#hy_price #block01 .block01_2 .block01_2_2:after,
#hy_price #block01 .block01_2 .block01_2_3:after,
#hy_price #block01 .block01_2 .block01_2_4:after {
display: none;
}
#hy_case #block02 .block02_2 li a .imgblock {
height: 50vw;
text-align: center;
}
#hy_oflinelp #block01 .block01_2 .row > div.block01_2_1,
#hy_oflinelp #block01 .block01_2 .row > div.block01_2_2 {
padding: 35vw 40px 10px;
margin-bottom: 40px;
}
#hy_oflinelp #block01 .block01_2 .row > div p.price {
font-size: 24px;
}
#hy_oflinelp #block01 .block01_2 a {
width: 100%;
}
#hy_oflinelp #block01 .block01_2 .row > div {
padding: 48vw 40px 10px;
}
#hy_oflinelp #block01 .block01_2 .block01_2_2:after,
#hy_oflinelp #block01 .block01_2 .block01_2_3:after,
#hy_oflinelp #block01 .block01_2 .block01_2_4:after {
display: none;
}
#hy_storeowner .black_block h5 {
font-size: 14px;
}
#hy_storeowner .black_block h4 {
font-size: 18px;
}
#hy_storeowner .outside_block h2 {
font-size: 16px;
}
#hy_storeowner #block_online li {
width: 40%;
margin: 0 2%;
}
#hy_storeowner #block_online li p {
font-size: 11.5px;
}
#hy_storeowner #block_online .inside_block li {
width: 44.44%;
margin: 0 2.22%;
}
#hy_storeowner .outside_block h4.underline {
font-size: 14px;
}
#hy_storeowner .outside_block .point {
width: 80px;
left: calc(50% - 40px);
}
#hy_storeowner #block_price h2 {
font-size: 18px;
}
#hy_storeowner #block_price li h4 {
font-size: 13px;
padding: 0.5em 1em;
}
#hy_storeowner #block_price p {
font-size: 24px;
}
#hy_storeowner #block_price p span {
font-size: 15px;
}
#hy_accounting_firm .white_block {
width: 90%;
height: 300px;
}
#hy_accounting_firm .green_block {
min-height: 340px;
}
#hy_accounting_firm #block_support .green_block {
height: auto;
}
#hy_accounting_firm #block_support .green_block li {
width: 98%;
}
#hy_accounting_firm #block_support .green_block li:nth-child(1),
#hy_accounting_firm #block_support .green_block li:nth-child(2),
#hy_accounting_firm #block_support .green_block li:nth-child(3) {
margin: 0 1% 1em;
}
#hy_accounting_firm #block_support .green_block li:nth-child(4) {
margin: 0 1%;
}
#hy_accounting_firm #block_help .white_block {
height: auto;
}
#hy_accounting_firm #block_possible .green_block {
height: auto;
}
#hy_accounting_firm #block_possible .green_block li {
width: 47%;
}
#hy_accounting_firm #block_price .green_block li h4 {
padding: 0.3em 0.5em;
margin-right: 1em;
font-size: 13px;
}
#hy_accounting_firm #block_price .green_block li p {
font-size: 24px;
}
} body.page-id-10165 {
background: #fff url(//help-you.me/wp1/wp-content/themes/hy/img/blog/h4_bg.png);
}
body.page-id-10165 .page-header_pageTitle {
text-indent: -9999px;
font-size: 0px;
margin: 5px 0;
}
body.page-id-10165 .siteContent {
position: relative;
}
body.page-id-10165 .mainSection {
position: static;
}
#document_dl {
background: #fff;
padding: 30px 0;
}
#document_dl h1 {
color: #000;
font-size: 26px;
margin-bottom: 40px;
}
#document_dl ul {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
max-width: 1000px;
width: 95%;
margin: 0 auto;
}
#document_dl li.dl_block {
width: 31%;
margin-bottom: 40px;
border: 4px solid #e5e5e5;
padding-bottom: 2em;
padding-top: 0;
min-width: 270px;
}
#document_dl li.dl_block:hover {
opacity: 0.7;
cursor: pointer;
}
#document_dl li.dl_block img {
width: 100%;
height: auto;
margin-bottom: 1.5em;
}
#document_dl li.dl_block .title {
background-repeat: no-repeat;
background-size: cover;
background-position: center;
overflow: hidden;
margin-bottom: 20px;
position: relative;
}
#document_dl li.dl_block .title:before {
content: "";
width: 30px;
height: 30px;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/download/helpyou_icon.png);
position: absolute;
top: 0;
right: 0;
} #document_dl h2.block_title {
text-align: center;
background: #cc0000;
font-weight: bold;
color: #fff;
line-height: 1.3;
padding: 0.5em 2.5%;
margin: 30px 0;
font-size: 17px;
}
#document_dl h3.block_subtitle {
text-align: center;
color: #cc0000;
font-size: 16px;
font-weight: bold;
line-height: 1.4;
padding: 0 5%;
margin-bottom: 15px;
}
#document_dl li.dl_block p {
line-height: 1.5;
padding: 0 5%;
margin-bottom: 20px;
min-height: 6em;
}
#document_dl a,
.dl_details a {
display: block;
color: #fff;
background: #000;
text-align: center;
padding: 0.8em 2.5%;
width: 90%;
margin: 0 auto;
}
.dl_details {
position: fixed;
width: 100%;
height: calc(100vh - 69px);
overflow-y: auto;
overflow-x: hidden;
top: 69px;
right: 0;
background: rgba(204, 0, 0, 0.6);
padding: 20px 0;
box-shadow: 0 10px 10px rgba(0, 0, 0, 0.5);
display: none;
z-index: 99;
}
.dl_details .bg {
background: #fff;
padding: 30px 0;
display: flex;
justify-content: space-around;
flex-wrap: wrap;
position: relative;
}
.dl_details .bg:before {
content: "";
width: 95px;
height: 130px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/download/outline.png);
position: absolute;
bottom: 0;
left: 0;
z-index: 0;
}
.dl_details .bg:after {
content: "";
width: 74px;
height: 585px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/download/download.png);
position: absolute;
top: 0;
left: -74px;
opacity: 0.6;
}
.dl_details #close_btn {
position: absolute;
top: 5px;
right: 5px;
display: block;
}
.dl_details #close_btn:hover {
opacity: 0.7;
cursor: pointer;
}
.dl_details .capture {
width: 50%;
z-index: 1;
text-align: center;
}
.dl_details .capture .top img {
width: 70%;
height: auto;
border: 1px solid #aaa;
}
.dl_details .capture .top {
margin-bottom: 30px;
}
.dl_details .capture .bottom img {
margin: 0 10px;
width: 20%;
height: auto;
border: 1px solid #aaa;
}
.dl_details.portrait .capture {
display: flex;
flex-wrap: nowrap;
justify-content: space-around;
align-items: center;
padding: 0 5%;
}
.dl_details.portrait .top {
width: 60%;
margin-bottom: 0;
}
.dl_details.portrait .top img {
width: 100%;
}
.dl_details.portrait .bottom {
width: 25%;
}
.dl_details.portrait .bottom img {
width: 100%;
margin: 10px 0;
}
.dl_details .text {
width: 50%;
padding: 0 5%;
}
.dl_details h3 {
position: relative;
margin-bottom: 10px;
line-height: 1.3;
font-weight: bold;
}
.dl_details .line {
width: 50%;
height: auto;
position: absolute;
left: 50%;
}
.dl_details h4 {
line-height: 1.3;
margin-top: 30px;
font-weight: bold;
}
.dl_details ol {
counter-reset: li;
list-style: none;
padding: 0;
font-size: 16px;
}
.dl_details ol li:before {
color: #cc0000;
font-weight: bold;
counter-increment: li;
content: counter(li) "　";
}
.dl_details ol li {
margin-bottom: 0.5em;
padding-left: 1.2em;
text-indent: -1.2em;
}
.dl_details p.message {
line-height: 1.3;
font-size: 13px;
margin-bottom: 1em;
}
@media screen and (max-width: 1000px) {
.dl_details .bg {
display: block;
}
.dl_details .capture {
width: 100%;
max-width: 500px;
margin: 0 auto 50px;
}
.dl_details .text {
width: 100%;
max-width: 500px;
margin: 0 auto;
}
.dl_details .line {
width: 100%;
left: 0;
}
.dl_details .bg:before {
display: none;
}
.dl_details h3 {
text-align: center;
}
.dl_details h4 {
text-align: center;
}
}
@media screen and (max-width: 991px) {
.dl_details {
height: calc(100vh - 50px);
top: 50px;
}
}
@media screen and (max-width: 498px) {
#document_dl h1 {
font-size: 18px;
}
#document_dl li.dl_block {
width: 95%;
min-width: inherit;
}
.dl_details h3 {
font-size: 17px;
}
.dl_details h4 {
font-size: 15px;
}
.dl_details ol li {
font-size: 14px;
}
.dl_details .capture .top img {
width: 90%;
}
.dl_details .capture .bottom img {
width: 30%;
}
.dl_details.portrait .capture .bottom img {
width: 100%;
}
} body.page-id-10611 .siteContent {
padding-top: 0;
padding-bottom: 0;
}
#seminar_page section {
padding: 80px 0;
}
#seminar_page img {
height: auto;
}
#seminar_page .inner {
width: 95%;
max-width: 1000px;
margin: 0 auto;
}
#seminar_page .bg-white {
background: #fff;
}
#seminar_page .bg-gray {
background: #eeeeee;
}
#seminar_page .bg-gray-pattern {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/bg_pattern.png) repeat;
}
#seminar_page .bg-orange {
background: #f28440;
}
#seminar_page .bg-blue {
background: #74aedf;
}
#seminar_page .bg-yellow {
background: #ffde00;
}
#seminar_page .bg-black {
background: #000;
}
#seminar_page .txt-white {
color: #fff;
}
#seminar_page .txt-orange {
color: #f28440;
}
#seminar_page .txt-blue {
color: #74aedf;
}
#seminar_page .txt-yellow {
color: #ffc600;
}
#seminar_page .txt-black {
color: #333333;
}
#seminar_page span.strong {
color: #4281df;
}
#seminar_page span.strong-y {
color: #ffb400;
}
#seminar_page .sec-title {
text-align: center;
margin-bottom: 2.5em;
font-weight: bold;
letter-spacing: 0.1em;
line-height: 1.5;
position: relative;
}
#seminar_page .sec-title:after {
content: "";
width: 30px;
height: 3px;
background: #6dc3da;
position: absolute;
bottom: -7px;
left: calc(50% - 15px);
}
#seminar_page #follow-up-outline .sec-title:after,
#seminar_page #follow-up-flow .sec-title:after {
background: #ffde00;
}
#seminar_page a:hover {
opacity: 0.7;
}
#seminar_page p {
font-size: 18px;
}
#seminar_page .app-btn {
display: inline-block;
margin: 0 auto;
padding: 1.5em 1em;
position: relative;
width: 340px;
font-size: 20px;
text-decoration: none;
background: #000;
border-radius: 0;
border: none;
}
#seminar_page .app-btn:after,
#seminar_page #contact .app-btn-wrapper:after {
content: "";
display: block;
width: 21px;
height: 60px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/white_r_arrow.png) center no-repeat;
background-size: contain;
position: absolute;
right: 1em;
top: 0.7em;
}
#seminar_page .app-btn:hover {
opacity: 0.7;
}
#seminar_page .mv {
text-align: right;
}
#seminar_page .mv span {
display: inline;
font-size: inherit;
line-height: inherit;
}
#seminar_page .mv span:before {
display: none;
}
#seminar_page .mv .mv_left {
display: inline-block;
width: 50%;
text-align: left;
vertical-align: top;
}
#seminar_page .mv .mv_left .balloon {
margin-top: 1.8em;
font-size: 1.65vw;
font-weight: bold;
color: #57a1df;
background: #fff;
display: inline-block;
padding: 0.3em 0.5em 0.2em;
position: relative;
}
#seminar_page .mv .mv_left .balloon span {
font-size: 2.1vw;
letter-spacing: 0.1em;
}
#seminar_page .mv .mv_left .balloon:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0.7em 0.8em 0;
border-color: transparent #fff transparent transparent;
position: absolute;
bottom: -0.8em;
left: 70%;
}
#seminar_page .mv .mv_left h1 {
text-align: left;
color: #000;
font-size: 5.1vw;
letter-spacing: 0.05em;
margin: 1em 0 0;
line-height: 1.2;
}
#seminar_page .mv .mv_left h1 span.dot,
#seminar_page #seminar_bnr span.dot {
padding: 0.3em 0;
background-repeat: repeat-x;
background-size: 1.05em 0.2em;
background-position: top left;
background-image: -webkit-gradient(radial, center center, 0, center center, 1.5, from(#fff), color-stop(0.5, #fff), color-stop(0.9, transparent), to(transparent));
background-image: -webkit-radial-gradient(center center, 0.1em 0.1em, #fff, #fff 95%, transparent 95%, transparent);
background-image: radial-gradient(0.1em 0.1em at center center, #fff, #fff 95%, transparent);
}
#seminar_page .mv .mv_left h1 span.txt-yellow,
#seminar_page #seminar_bnr span.txt-yellow {
color: #ffde00;
}
#seminar_page .mv .mv_left .note {
font-size: 1.15vw;
line-height: 1.2;
}
#seminar_page .mv .mv_left .mv_profile {
width: 95%;
height: auto;
margin-top: 1vw;
}
#seminar_page .mv .mv_photo {
display: inline-block;
width: 40%;
vertical-align: top;
}
#seminar_page .mv .mv_photo_div {
display: none;
}
#seminar_page #application {
padding: 20px 0 50px;
}
#seminar_page #application .sec-title {
margin-bottom: 1em;
}
#seminar_page #application .sec-title:after {
display: none;
}
#seminar_page #outline {
padding: 0;
}
#seminar_page #outline .inner {
width: 100%;
max-width: 1440px;
display: flex;
flex-wrap: nowrap;
}
#seminar_page #outline .outline-img {
width: 50%;
}
#seminar_page #outline .txt {
width: 50%;
padding: 40px 3%;
text-align: left;
}
#seminar_page #outline .txt h5 {
line-height: 1.5;
font-size: 1.7vw;
}
#seminar_page #outline .txt h5 span {
display: inline-block;
position: relative;
}
#seminar_page #outline .txt h5 span:after {
content: "";
width: 30px;
height: 3px;
background: #6dc3da;
position: absolute;
bottom: -7px;
left: 0;
}
#seminar_page #outline .txt p {
line-height: 1.5;
font-size: 1.4vw;
}
#seminar_page #solution .block-title {
font-weight: bold;
margin-bottom: 1em;
line-height: 1.5;
}
#seminar_page #solution .block {
display: flex;
justify-content: space-between;
flex-wrap: nowrap;
}
#seminar_page #solution .block > li {
width: 48%;
position: relative;
padding: 20px 5%;
text-align: center;
}
#seminar_page #solution .block > li:nth-child(2) {
width: 4%;
display: flex;
justify-content: center;
align-items: center;
padding: 0;
}
#seminar_page #solution .block > li:nth-child(2) img {
max-width: 25px;
width: 80%;
}
#seminar_page #solution .block > li h4 {
height: 80px;
}
#seminar_page #solution .block > li:last-child h4 {
color: #ffde00;
line-height: 1.3;
}
#seminar_page #solution p {
display: inline-block;
text-align: left;
}
#seminar_page #solution .list {
text-align: left;
display: inline-block;
}
#seminar_page #solution .list li {
font-size: 16px;
position: relative;
margin-left: 17px;
line-height: 1.3;
padding: 0.5em 0;
}
#seminar_page #solution .list li:before {
content: "";
display: block;
width: 7px;
height: 19px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/blue_slash.png) center no-repeat;
background-size: contain;
position: absolute;
left: -17px;
top: 5px;
}
#seminar_page #solution .block > li:last-child .list li:before {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/white_slash.png);
}
#seminar_page #plan-flow li {
border: 3px solid #74aedf;
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 2%;
margin-bottom: 20px;
position: relative;
}
#seminar_page #plan-flow li:after {
content: "";
display: block;
width: 42px;
height: 19px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/step_arrow.png) center no-repeat;
background-size: contain;
position: absolute;
bottom: -20px;
left: calc(50% - 20px);
}
#seminar_page #plan-flow li.last-step {
margin-bottom: 0;
}
#seminar_page #plan-flow li.last-step:after {
display: none;
}
#seminar_page #plan-flow li .step-number {
margin: 0;
letter-spacing: 0.2em;
font-weight: bold;
color: #74aedf;
}
#seminar_page #plan-flow li .step-title {
width: 25%;
font-weight: bold;
line-height: 1.3;
}
#seminar_page #plan-flow li p {
width: 45%;
margin: 0;
line-height: 1.5;
}
#seminar_page .training-outline-block {
padding: 20px 2.5%;
position: relative;
}
#seminar_page .training-outline-block .title {
font-weight: bold;
line-height: 1.4;
margin-bottom: 1em;
}
#seminar_page .duration {
position: absolute;
right: 2%;
top: 1em;
letter-spacing: 0.1em;
margin-bottom: 0;
}
#seminar_page .duration .number {
font-size: 28px;
font-weight: bold;
margin-left: 0.5em;
margin-right: 0.2em;
}
#seminar_page .duration .unit {
font-size: 22px;
}
#seminar_page .sub-title {
font-weight: normal;
margin: 0 0 0.5em 1em;
letter-spacing: 0.1em;
}
#seminar_page .txt {
padding: 0.5em 2%;
line-height: 1.5;
}
#seminar_page .training-flow-item {
position: relative;
border: 3px solid #74aedf;
margin-bottom: 20px;
padding: 20px 2%;
}
#seminar_page #follow-up-flow .training-flow-item {
border-color: #ffde00;
}
#seminar_page .training-step {
font-weight: bold;
margin-bottom: 0;
}
#seminar_page .training-flow-item .plus-btn,
#seminar_page .training-flow-item .minus-btn {
vertical-align: middle;
display: inline-block;
margin-left: 15px;
margin-top: -10px;
}
#seminar_page .training-flow-item .plus-btn:hover,
#seminar_page .training-flow-item .minus-btn:hover {
cursor: pointer;
opacity: 0.7;
}
#seminar_page .training-flow-item table {
margin-top: 30px;
}
#seminar_page .training-flow-item th {
border: 3px solid #74aedf;
border-bottom: none;
font-size: 16px;
padding: 0.5em 1em;
position: relative;
vertical-align: top;
padding-top: 1em;
height: auto;
}
#seminar_page .training-flow-item th ul {
margin: 0;
}
#seminar_page .training-flow-item th li {
line-height: 1.3;
margin-bottom: 0.3em;
text-indent: -0.9em;
padding-left: 0.9em;
}
#seminar_page .training-flow-item th li:last-child {
margin-bottom: 0;
}
#seminar_page #follow-up-flow .training-flow-item th {
border-color: #ffde00;
}
#seminar_page .training-flow-item th:before {
content: "";
display: block;
width: 5px;
height: 100%;
position: absolute;
top: 1em;
left: -4px;
background: #fff;
}
#seminar_page .training-flow-item th .line_hide {
display: block;
width: 5px;
height: 100%;
position: absolute;
top: 1em;
left: calc(-25% - 4px);
background: #fff;
}
#seminar_page .training-flow-item th:after {
content: "";
display: block;
width: 5px;
height: 100%;
position: absolute;
top: 1em;
right: -4px;
background: #fff;
}
#seminar_page .training-flow-item .outline {
width: 20%;
}
#seminar_page .training-flow-item .details {
padding-left: 3%;
}
#seminar_page .effect-outer-block {
padding: 20px 2% 40px;
}
#seminar_page .effect-inner-block {
padding: 1.5em 2%;
}
#seminar_page .effect-inner-block p {
color: #4281df;
line-height: 1.5;
}
#seminar_page .effect-outer-block h3 {
margin: 0 0 1em;
padding-left: 1em;
}
#seminar_page .effect-figure-sp {
display: none;
}
#seminar_page .price-plan {
padding: 3em 2.5%;
text-align: center;
}
#seminar_page .price-plan .block-title {
font-weight: bold;
margin-bottom: 0.8em;
min-height: 2.5em;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
}
#seminar_page .price-plan .block-title span {
font-size: 14px;
width: 100%;
}
#seminar_page .price-plan li {
padding: 20px 2.5%;
text-align: center;
width: 48%;
}
#seminar_page .price-plan-item-wrapper {
display: flex;
justify-content: space-around;
flex-wrap: nowrap;
width: 100%;
}
#seminar_page .price-plan-item {
width: 30%;
}
#seminar_page .price-plan-inner {
padding: 10px 3px 3px;
width: 95%;
margin: 0 auto;
}
#seminar_page .price-plan-inner .upper {
height: 80px;
display: flex;
align-items: center;
justify-content: center;
}
#seminar_page .price-plan-item:last-child .price-plan-inner .upper {
height: 160px;
}
#seminar_page .price-plan-inner .lower {
height: 80px;
display: flex;
align-items: center;
justify-content: center;
background: #eeeeee;
}
#seminar_page .price-plan-inner h3 {
font-size: 20px;
font-weight: bold;
}
#seminar_page .price-plan-inner h3 span {
font-size: 38px;
font-weight: bold;
margin-right: 0.1em;
}
#seminar_page .price-plan-inner p {
font-size: 15px;
margin-bottom: 2em;
margin-top: 0.5em;
min-height: 1.5em;
}
#seminar_page .price-plan-inner h4 {
line-height: 1.3;
font-size: 18px;
font-weight: bold;
background: #eeeeee;
display: flex;
align-items: center;
justify-content: center;
height: 80px;
border-radius: 0;
}
#seminar_page #price .note {
text-align: center;
margin-top: 1.5em;
}
#seminar_page .satisfaction-outer-block {
padding: 40px 2%;
}
#seminar_page .satisfaction-inner-block {
padding: 20px 2%;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}
#seminar_page .satisfaction-inner-block .txt {
width: calc(100% - 260px);
}
#seminar_page .satisfaction-inner-block .chart {
width: 230px;
margin: 8px 10px 0 0;
}
#seminar_page .satisfaction-inner-block .balloon-list li {
display: flex;
justify-content: space-between;
flex-wrap: nowrap;
align-items: flex-start;
margin-bottom: 1em;
}
#seminar_page .satisfaction-inner-block .icon {
width: 50px;
height: auto;
margin-top: 10px;
}
#seminar_page .satisfaction-inner-block .balloon {
width: calc(100% - 56px);
position: relative;
padding: 7px 10px;
border: solid 3px #74aedf;
border-radius: 10px;
}
#seminar_page .satisfaction-inner-block .balloon:before {
content: "";
position: absolute;
top: 30px;
left: -10px;
margin-top: -4px;
border: 4px solid transparent;
border-right: 6px solid #fff;
z-index: 2;
}
#seminar_page .satisfaction-inner-block .balloon:after {
content: "";
position: absolute;
top: 30px;
left: -16px;
margin-top: -6px;
border: 6px solid transparent;
border-right: 8px solid #74aedf;
z-index: 1;
}
#seminar_page .satisfaction-inner-block p {
color: #74aedf;
line-height: 1.5;
font-size: 13px;
padding-left: 56px;
margin: 0;
}
#seminar_page .satisfaction-inner-block .chart-list {
color: #4281df;
line-height: 1.5;
font-size: 13px;
padding-left: 56px;
margin-bottom: 1em;
}
#seminar_page .satisfaction-inner-block .chart-list li {
display: inline-block;
margin-right: 1em;
}
#seminar_page .tel {
color: #c72d29;
font-weight: bold;
font-size: 40px;
line-height: 0.9;
letter-spacing: 0.1em;
text-decoration: none;
}
@media screen and (max-width: 498px) {
#seminar_page .tel {
font-size: 28px;
letter-spacing: 0;
}
}
#seminar_page #contact .seminar-form-item {
display: flex;
flex-wrap: nowrap;
margin-bottom: 22px;
}
#seminar_page #contact .seminar-form-item br {
display: none;
}
#seminar_page #contact .seminar-form-item label,
#seminar_page #contact th {
background: #d2d9df;
width: 40%;
padding: 0.8em 2.5%;
font-size: 17px;
letter-spacing: 0.1em;
margin: 0;
font-weight: bold;
}
#seminar_page #contact th {
vertical-align: top;
}
#seminar_page #contact .seminar-form-item label .small,
#seminar_page #contact th .small {
font-size: 14px;
font-weight: normal;
}
#seminar_page #contact .seminar-form-item .wpcf7-form-control-wrap {
width: 60%;
}
#seminar_page #contact .seminar-form-item input,
#seminar_page #contact .seminar-form-item select,
#seminar_page #contact td {
border: 1.5px solid #d2d2d2;
border-left: none;
border-radius: 0;
border-left: none;
height: 100%;
box-shadow: none;
border-color: #d2d2d2;
}
#seminar_page #contact td p {
margin-bottom: 0;
}
#seminar_page #contact span.wpcf7-list-item {
display: block;
margin: 0;
line-height: 1.5;
}
#seminar_page #contact .app-btn-outer {
margin: 100px 0 50px;
}
#seminar_page #contact .app-btn-wrapper {
display: inline-block;
position: relative;
width: 340px;
}
#seminar_page #voice {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/bg_voice.jpg) center no-repeat;
background-size: cover;
text-align: center;
}
#seminar_page #voice ul {
display: inline-block;
background: #fff;
padding: 2em 5%;
}
#seminar_page #voice li {
font-size: 16px;
position: relative;
margin-left: 17px;
padding: 0.75em 0;
text-align: left;
line-height: 1.3;
}
#seminar_page #voice li:before {
content: "";
display: block;
width: 7px;
height: 19px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/blue_slash.png) center no-repeat;
background-size: contain;
position: absolute;
left: -17px;
top: 13px;
}
#seminar_page .sp_br {
display: none;
}
body.page-id-10611 .siteContent_after {
background: #74aedf;
}
body.page-id-10611 footer {
background: #74aedf;
color: #000;
}
body.page-id-10611 footer .widget_nav_menu ul li a {
color: #000;
}
body.page-id-10611 footer .copySection {
border-top: 2px solid #000;
}
body.page-id-10611 footer .copySection p {
color: #000;
}
body.page-id-10611 footer .copySection p a {
color: #000 !important;
}
body.page-id-10611 .page .entry-body {
padding-bottom: 0;
}
body.page-id-10611 .siteContent_after h3 {
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/logo_bk.png);
}
#seminar_page #seminar_bnr {
position: fixed;
right: -400px;
bottom: 80px;
background: #fff;
border: 1px solid #d9d9d9;
border-right: none;
text-align: center;
transition: 0.3s;
z-index: 10;
}
#seminar_page #seminar_bnr.active {
right: 0;
}
#seminar_page #seminar_bnr .upper {
background: #74aedf;
padding: 10px 20px;
text-align: center;
}
#seminar_page #seminar_bnr h3 {
font-weight: bold;
letter-spacing: 0.05em;
line-height: 1.2;
text-align: left;
margin-top: 0.2em;
display: inline-block;
}
#seminar_page #seminar_bnr .lower {
padding: 10px 20px 20px;
}
#seminar_page #seminar_bnr p {
font-size: 15px;
line-height: 1.7;
}
#seminar_page #seminar_bnr .tel {
color: #c72d29;
font-size: 24px;
font-weight: bold;
text-decoration: none;
}
#seminar_page #seminar_bnr h5 {
margin-bottom: 0;
font-weight: normal;
}
#seminar_page #seminar_bnr .app-btn {
padding: 1.2em 1em;
width: 220px;
font-size: 16px;
}
#seminar_page #seminar_bnr .app-btn:after {
width: 11px;
height: 45px;
right: 0.8em;
top: 0.5em;
}
#seminar_page #seminar_bnr #close_btn {
width: 25px;
height: 25px;
position: absolute;
top: -25px;
right: 0;
display: flex;
justify-content: center;
align-items: center;
background: #74aedf;
font-size: 25px;
color: #fff;
border-top: 1px solid #d9d9d9;
border-left: 1px solid #d9d9d9;
}
#seminar_page #seminar_bnr #close_btn:hover {
opacity: 0.7;
cursor: pointer;
}
#seminar_page .view_doc_br {
display: none;
}
#seminar_page .view_doc {
display: inline-block;
background: #74aedf;
text-align: center;
font-size: 15px;
padding: 0.2em 0.5em;
color: #fff;
margin-left: 1em;
margin-top: -5px;
vertical-align: middle;
}
#seminar_page #view_doc02 {
background: #ffc600;
}
#seminar_page .view_doc:hover {
opacity: 0.7;
cursor: pointer;
}
#seminar_page .forSP {
display: none;
}
@media screen and (max-width: 1000px) {
#seminar_page .sp_br {
display: block;
}
#seminar_page p {
font-size: 16px;
}
#seminar_page #outline .inner {
flex-wrap: wrap;
justify-content: center;
}
#seminar_page .training-flow-item td {
font-size: 16px;
}
#seminar_page #solution .block {
flex-wrap: wrap;
justify-content: center;
}
#seminar_page #solution .block > li {
width: 100%;
max-width: 600px;
margin-bottom: 10px;
}
#seminar_page #solution .block > li:nth-child(2) {
width: 100%;
}
#seminar_page #solution .block > li:nth-child(2) img {
transform: rotate(90deg);
}
}
@media screen and (max-width: 767px) {
#seminar_page .mv {
text-align: center;
}
#seminar_page .mv .mv_left {
width: 95%;
display: block;
margin: 0 auto;
}
#seminar_page .mv .mv_left .balloon {
font-size: 3.2vw;
}
#seminar_page .mv .mv_left .balloon span {
font-size: 3.7vw;
letter-spacing: 0.1em;
}
#seminar_page .mv .mv_left h1 {
font-size: 10vw;
}
#seminar_page .mv .mv_left .note {
font-size: 11.5px;
margin-top: 1em;
}
#seminar_page .mv .mv_left .mv_profile {
width: 100%;
margin-top: 15px;
}
#seminar_page .mv .mv_photo {
display: none;
}
#seminar_page .mv .mv_photo_div {
display: block;
width: 100%;
height: 45vw;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/mv_photo.jpg) center no-repeat;
background-size: cover;
margin-top: 20px;
}
#seminar_page #outline .outline-img {
width: 100%;
}
#seminar_page #outline .txt {
width: 100%;
}
#seminar_page #outline .txt h5 {
font-size: 20px;
}
#seminar_page #outline .txt p {
font-size: 16px;
}
#seminar_page #plan-flow li {
flex-wrap: wrap;
justify-content: flex-start;
}
#seminar_page #plan-flow li .step-number {
margin-right: 2%;
}
#seminar_page #plan-flow li .step-title {
margin-left: 2%;
min-width: 200px;
}
#seminar_page #plan-flow li p {
width: 100%;
}
#seminar_page .training-flow-item .outline {
min-width: inherit;
}
#seminar_page .training-flow-item td {
font-size: 14px;
}
#seminar_page .effect-outer-block {
padding: 20px 4% 40px;
}
#seminar_page .effect-outer-block h3 {
padding-left: 0;
}
#seminar_page .effect-figure {
width: 100%;
max-width: 320px;
margin: 0 auto;
}
#seminar_page .price-plan-item-wrapper {
justify-content: center;
flex-wrap: wrap;
}
#seminar_page .price-plan-item {
width: 95%;
max-width: 350px;
margin-bottom: 40px;
}
#seminar_page .price-plan .block-title {
min-height: inherit;
}
#seminar_page .satisfaction-inner-block {
justify-content: center;
}
#seminar_page .satisfaction-inner-block .txt {
width: 100%;
}
#seminar_page .satisfaction-inner-block .chart {
width: 80%;
margin: 40px auto 30px;
max-width: 250px;
}
#seminar_page .satisfaction-inner-block .icon {
width: 40px;
margin-top: 10px;
}
#seminar_page .satisfaction-inner-block .balloon {
width: calc(100% - 46px);
}
#seminar_page .satisfaction-inner-block p {
padding-left: 46px;
}
#seminar_page .satisfaction-inner-block .chart-list-wrapper {
text-align: center;
}
#seminar_page .satisfaction-inner-block .chart-list {
padding-left: 0;
display: inline-block;
}
#seminar_page #contact .seminar-form-item label {
font-size: 15px;
letter-spacing: 0;
}
#seminar_page #contact .seminar-form-item label .small {
font-size: 13px;
}
#seminar_page .duration {
position: relative;
top: 0;
text-align: right;
}
#seminar_page .training-step {
font-weight: bold;
margin-bottom: 0.5em;
}
#seminar_page #seminar_bnr .upper {
padding: 10px 10px;
}
#seminar_page #seminar_bnr h3 {
font-size: 16px;
}
#seminar_page #seminar_bnr .lower {
padding: 10px 10px 20px;
}
#seminar_page #seminar_bnr p {
font-size: 13px;
}
#seminar_page #seminar_bnr .tel {
font-size: 18px;
}
#seminar_page #seminar_bnr h5 {
font-size: 15px;
}
#seminar_page #seminar_bnr .app-btn {
padding: 1.2em 0.7em 1.2em 0.3em;
width: 150px;
font-size: 12px;
}
#seminar_page #seminar_bnr .app-btn:after {
width: 7px;
height: 40px;
right: 0.6em;
top: 0.2em;
}
#seminar_page .pc_br {
display: none;
}
#seminar_page .forPC {
display: none;
}
#seminar_page .forSP {
display: block;
}
}
@media screen and (max-width: 498px) {
#seminar_page .app-btn {
width: 100%;
}
#seminar_page #plan-flow li {
justify-content: center;
}
#seminar_page #plan-flow li .step-number {
width: 100%;
text-align: center;
margin-right: 0;
}
#seminar_page #plan-flow li .step-title {
width: 100%;
margin-left: 0;
margin-bottom: 0.5em;
text-align: center;
}
#seminar_page .training-outline-block .title {
font-size: 18px;
}
#seminar_page .duration .number {
font-size: 24px;
}
#seminar_page .duration .unit {
font-size: 18px;
}
#seminar_page span.wpcf7-list-item {
margin: 0;
}
#seminar_page .view_doc_br {
display: block;
}
#seminar_page .view_doc {
margin-top: 10px;
margin-left: 0;
}
#seminar_page .training-flow-item th {
font-size: 14px;
}
} #seminar_page #doc01 {
background: #74aedf;
padding-bottom: 30px;
}
#seminar_page #doc02 {
background: #ffde00;
padding-bottom: 30px;
}
#seminar_page .dl_details .bg:before,
#seminar_page .dl_details .bg:after {
display: none;
}
#seminar_page .dl_details .p_close_btn {
position: absolute;
top: 5px;
right: 5px;
display: block;
}
#seminar_page .dl_details .p_close_btn:hover {
opacity: 0.7;
cursor: pointer;
}
#seminar_page .dl_details .capture .top img {
width: 70%;
height: auto;
border: none;
margin-bottom: 10px;
}
#seminar_page .dl_details .capture .top img.gray-border {
border: 1px solid #eeeeee;
}
#seminar_page .dl_details .capture .top {
margin-bottom: 0;
}
#seminar_page .dl_details h3 span {
font-size: 15px;
}
#seminar_page .dl_details .line {
width: 50%;
height: 2px;
position: absolute;
left: 50%;
display: inline-block;
}
#seminar_page #doc01 .line {
background: #74aedf;
}
#seminar_page #doc02 .line {
background: #ffde00;
}
#seminar_page .dl_details h4 {
text-align: left;
}
#seminar_page .dl_details h4.time {
text-align: right;
margin-top: 20px;
}
#seminar_page #doc01 ol li:before {
color: #74aedf;
}
#seminar_page #doc02 ol li:before {
color: #ffc600;
}
#seminar_page .dl_details ol li p {
font-size: 14px;
margin-left: -20px;
text-indent: 0;
line-height: 1.5;
}
@media screen and (max-width: 1000px) {
#seminar_page .dl_details .line {
width: 100%;
left: 0;
}
}
@media screen and (max-width: 498px) {
#seminar_page .dl_details h3 span {
font-size: 13px;
}
} #hy_company.hy_lp .about {
margin: 6em 0 5em;
}
#hy_company.hy_lp .about h2 {
color: #000;
font-size: 44px;
text-align: center;
}
#hy_company.hy_lp .about h3 {
font-size: 24px;
text-align: center;
line-height: 1.8em;
margin-bottom: 1.2em;
}
#hy_company.hy_lp .about .illust_goriyou {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/illust_goriyou.gif) center top no-repeat;
height: 100vw;
max-height: 600px;
background-size: contain;
}
@media screen and (max-width: 991px) {
#hy_company.hy_lp .about .illust_goriyou {
background-size: 80% auto;
}
}
@media screen and (max-width: 767px) {
#hy_company.hy_lp .about h2 {
font-size: 22px;
}
#hy_company.hy_lp .about h3 {
font-size: 15px;
}
#hy_company.hy_lp .about .illust_goriyou {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/top/illust_goriyou.gif) center top no-repeat;
width: calc(100% - 30px);
height: 50vw;
max-height: none;
background-size: contain;
margin: 0 auto;
}
} body.page-id-11333 #satori__creative_container {
display: none;
} body.page-id-12086 .entry-body {
padding-bottom: 0;
}
body.page-id-12086 .siteContent {
padding-bottom: 0;
}
body.page-id-12086 .siteContent_after {
background: #fff;
}
body.page-id-12086 .siteContent_after h3 {
background: url(//help-you.me/wp1/wp-content/uploads/2018/08/logo.png) center top no-repeat;
background-size: contain;
height: 22.69px;
}
body.page-id-12086 footer {
background: #fff;
color: #cc0000;
}
body.page-id-12086 footer .copySection {
border-top: 2px solid #cc0000;
}
body.page-id-12086 footer .copySection p,
body.page-id-12086 footer .copySection a {
color: #585858 !important;
}
#cp0103 .txt_red {
color: #c60000;
}
#cp0103 a,
#cp0103 a:hover {
text-decoration: none;
}
#cp0103 .btn_blue {
display: flex;
margin: 0 auto;
padding: 0.6em 1.5em;
text-align: center;
color: white;
background: #185d9a;
justify-content: center;
align-items: center;
box-shadow: 5px 5px 10px rgba(0, 0, 0, 1);
font-size: 21px;
width: 214px;
}
#cp0103 .btn_blue:hover,
#cp0103 .btn_blue:active {
box-shadow: 0 0 5px rgba(0, 0, 0, 1);
position: relative;
top: 5px;
left: 5px;
}
#cp0103 h2.sec_title {
color: #c60000;
border: 3px solid #c60000;
padding: 0.4em 0;
width: 225px;
margin: 0 auto 50px;
text-align: center;
line-height: 1.5;
font-size: 27px;
}
@media screen and (max-width: 991px) {
#cp0103 h2.sec_title {
width: 200px;
font-size: 22px;
}
}
@media screen and (max-width: 767px) {
#cp0103 h2.sec_title {
width: 150px;
font-size: 18px;
}
}
#cp0103 .cta {
background: #145f9a;
padding: 30px 0 20px;
}
#cp0103 .cta_wrapper {
display: flex;
align-items: flex-start;
justify-content: space-between;
flex-wrap: wrap;
width: 100%;
max-width: 700px;
margin: 0 auto;
}
@media screen and (max-width: 767px) {
#cp0103 .cta_wrapper {
justify-content: center;
}
}
#cp0103 .cta_left {
border: 2px solid #fff;
padding: 10px 1em 0px;
text-align: center;
color: #fff;
position: relative;
max-width: 291px;
width: 100%;
}
@media screen and (max-width: 767px) {
#cp0103 .cta_left {
margin-bottom: 20px;
}
}
#cp0103 .cta_left h3 {
background: #145f9a;
position: absolute;
top: -10px;
left: 1em;
font-size: 23px;
}
#cp0103 .cta_left p {
margin-bottom: 0;
font-size: 13px;
line-height: 1.7;
}
#cp0103 .cta_left p .large {
font-size: 15px;
}
#cp0103 .cta_left p .xlarge {
font-size: 23px;
font-weight: bold;
}
@media screen and (max-width: 767px) {
#cp0103 .cta_right {
width: 100%;
}
}
#cp0103 .btn_red {
width: 306px;
height: 99px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
color: #fff;
border-radius: 62px;
background: #c60000;
box-shadow: 3px 3px 6px rgba(0, 0, 0, 1);
margin-top: 2px;
font-size: 22px;
}
@media screen and (max-width: 767px) {
#cp0103 .btn_red {
width: 250px;
height: 85px;
border-radius: 42.5px;
font-size: 18px;
margin: 2px auto 0;
}
}
#cp0103 .btn_red:hover,
#cp0103 .btn_red:active {
box-shadow: 0 0 3px rgba(0, 0, 0, 1);
position: relative;
top: 3px;
left: 3px;
}
#cp0103 section.top {
background: #f7f5f5;
padding-top: 10px;
padding-bottom: 30px;
}
#cp0103 .mv {
width: 100%;
height: 340px;
text-align: center;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/cp0103/mv_illust01.png), url(//help-you.me/wp1/wp-content/themes/hy/img/cp0103/mv_illust02.png);
background-repeat: no-repeat;
background-position: left bottom, right top;
background-size: 35.2% auto, 33.3% auto;
padding-top: 40px;
}
@media screen and (max-width: 991px) {
#cp0103 .mv {
height: 271px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .mv {
height: 126.2vw;
background-size: 61.7% auto, 41.7% auto;
background-position: top left 5vw, center bottom;
padding-top: 57vw;
}
}
@media screen and (max-width: 767px) {
#cp0103 .mv .container {
padding: 0;
}
}
#cp0103 .mv p {
margin: 1em 0;
}
@media screen and (max-width: 767px) {
#cp0103 .mv p {
font-size: 2.2vw;
}
}
#cp0103 .mv .logo {
height: auto;
width: 31.5%;
margin-bottom: 35px;
}
@media screen and (max-width: 767px) {
#cp0103 .mv .logo {
width: 61.6%;
margin-bottom: 25px;
}
}
#cp0103 .yellow_circle {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
width: 75%;
margin: -50px auto 0;
}
@media screen and (max-width: 991px) {
#cp0103 .yellow_circle {
margin: -20px auto 0;
}
}
@media screen and (max-width: 767px) {
#cp0103 .yellow_circle {
width: 85%;
}
}
#cp0103 .yellow_circle li {
width: 29%;
}
@media screen and (max-width: 767px) {
#cp0103 .yellow_circle li {
width: 31%;
}
}
#cp0103 .yellow_circle li .circle_in {
background: #f2d970;
border-radius: 50%;
width: 100%;
padding-top: 100%;
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
#cp0103 .yellow_circle li .txt {
position: absolute;
text-align: center;
top: calc(50% - 2em);
font-size: 20px;
line-height: 1.5;
width: 100%;
font-size: 22px;
}
@media screen and (max-width: 991px) {
#cp0103 .yellow_circle li .txt {
font-size: 16px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .yellow_circle li .txt {
font-size: 3vw;
}
}
#cp0103 .yellow_circle li .txt span {
font-size: 42px;
}
@media screen and (max-width: 991px) {
#cp0103 .yellow_circle li .txt span {
font-size: 32px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .yellow_circle li .txt span {
font-size: 5.5vw;
}
}
#cp0103 .yellow_circle li:last-child .txt {
line-height: 2.2em;
}
#cp0103 .top h2 {
text-align: center;
line-height: 1.5;
font-size: 25px;
}
@media screen and (max-width: 991px) {
#cp0103 .top h2 {
font-size: 20px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .top h2 {
font-size: 3.5vw;
}
}
#cp0103 section.campaign {
background: #fffdf7;
}
@media screen and (max-width: 767px) {
#cp0103 section.campaign img {
max-width: 584px;
width: 90%;
}
}
#cp0103 section.campaign .container {
text-align: center;
padding: 20px 0 35px;
}
@media screen and (max-width: 767px) {
#cp0103 section.campaign .container {
padding: 20px 2.5% 35px;
}
}
#cp0103 section.campaign .btn_blue {
margin-top: 20px;
}
#cp0103 section.work {
background: #efeaea;
padding: 35px 0 70px;
}
@media screen and (max-width: 767px) {
#cp0103 section.work .container {
padding: 0;
}
}
#cp0103 .work_tab {
position: relative;
width: 90%;
margin: 0 auto;
}
#cp0103 .tab_item .tab {
width: 144px;
height: 71px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
color: #83b9c9;
font-size: 24px;
background: #fff;
border: 3px solid #83b9c9;
border-bottom: none;
position: absolute;
top: 0;
left: 0;
margin-bottom: -3px;
z-index: 10;
box-shadow: -6px 0 6px -6px rgba(0, 0, 0, 0.16);
}
@media screen and (max-width: 991px) {
#cp0103 .tab_item .tab {
width: 115px;
height: 56px;
font-size: 20px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .tab_item .tab {
width: 4vw;
height: 4vw;
border-radius: 16px;
background: rgba(88, 88, 88, 0.5);
border: none;
bottom: -8vw;
top: auto;
left: 25vw;
}
#cp0103 .tab_item .tab span {
display: none;
}
}
#cp0103 .tab_item .tab.active {
height: 74.2px;
}
@media screen and (max-width: 991px) {
#cp0103 .tab_item .tab.active {
height: 59.2px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .tab_item .tab.active {
background: rgba(88, 88, 88, 1);
width: 4vw;
height: 4vw;
}
}
#cp0103 .tab_item.jinji .tab {
border-color: #7bb333;
color: #7bb333;
left: 144px;
}
@media screen and (max-width: 991px) {
#cp0103 .tab_item.jinji .tab {
left: 115px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .tab_item.jinji .tab {
left: 35vw;
}
}
#cp0103 .tab_item.somu .tab {
border-color: #a08080;
color: #a08080;
left: 288px;
}
@media screen and (max-width: 991px) {
#cp0103 .tab_item.somu .tab {
left: 230px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .tab_item.somu .tab {
left: 45vw;
}
}
#cp0103 .tab_item.eigyo .tab {
border-color: #d3861b;
color: #d3861b;
left: 432px;
box-shadow: 6px 0 6px -6px rgba(0, 0, 0, 0.16);
}
@media screen and (max-width: 991px) {
#cp0103 .tab_item.eigyo .tab {
left: 345px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .tab_item.eigyo .tab {
left: 55vw;
}
}
#cp0103 .tab_item .tab:hover {
cursor: pointer;
}
#cp0103 .tab_item_block {
background: #fff;
padding: 40px 20px 25px;
border: 3px solid #83b9c9;
margin-top: 71px;
width: 100%;
display: inline-block;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}
@media screen and (max-width: 991px) {
#cp0103 .tab_item_block {
margin-top: 56px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .tab_item_block {
margin-top: 0;
}
}
#cp0103 .jinji .tab_item_block {
display: none;
border-color: #7bb333;
}
#cp0103 .somu .tab_item_block {
display: none;
border-color: #a08080;
}
#cp0103 .eigyo .tab_item_block {
display: none;
border-color: #d3861b;
}
#cp0103 .tab_item_block h3 {
font-size: 30px;
text-align: center;
color: #83b9c9;
font-size: 53px;
}
@media screen and (max-width: 991px) {
#cp0103 .tab_item_block h3 {
font-size: 40px;
}
}
#cp0103 .jinji .tab_item_block h3 {
color: #7bb333;
}
#cp0103 .somu .tab_item_block h3 {
color: #a08080;
}
#cp0103 .eigyo .tab_item_block h3 {
color: #d3861b;
}
#cp0103 .tab_item_block h4 {
color: #585858;
font-size: 34px;
}
@media screen and (max-width: 991px) {
#cp0103 .tab_item_block h4 {
font-size: 24px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .tab_item_block h4 {
font-size: 5vw;
text-align: center;
}
}
#cp0103 .work_contents_upper {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
#cp0103 .work_contents_upper {
justify-content: center;
}
}
#cp0103 .work_contents_upper .img {
width: 46%;
}
@media screen and (max-width: 767px) {
#cp0103 .work_contents_upper .img {
width: 75%;
margin-top: 20px;
}
}
#cp0103 .work_contents_upper .img img {
width: 100%;
height: auto;
}
#cp0103 .work_contents_upper .txt {
width: 50%;
margin-top: 20px;
}
@media screen and (max-width: 767px) {
#cp0103 .work_contents_upper .txt {
width: 80%;
margin-top: 20px;
}
}
#cp0103 .work_example {
color: #83b9c9;
}
#cp0103 .jinji .work_example {
color: #7bb333;
}
#cp0103 .somu .work_example {
color: #a08080;
}
#cp0103 .eigyo .work_example {
color: #d3861b;
}
#cp0103 .work_example li:before {
content: "・";
}
#cp0103 .work_example li {
margin-left: 1em;
text-indent: -1em;
font-size: 22px;
}
@media screen and (max-width: 991px) {
#cp0103 .work_example li {
font-size: 17px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .work_example li {
font-size: 3vw;
}
}
#cp0103 .work_contents_lower .gray_block {
background: #959595;
color: #fff;
width: 80%;
height: 160px;
position: relative;
padding: 20px;
}
@media screen and (max-width: 767px) {
#cp0103 .work_contents_lower .gray_block {
width: 80%;
height: auto;
margin: 45vw auto 0;
}
}
#cp0103 .work_contents_lower .gray_block h5 {
font-size: 22px;
font-weight: normal;
margin-bottom: 0.5em;
}
@media screen and (max-width: 991px) {
#cp0103 .work_contents_lower .gray_block h5 {
font-size: 18px;
}
}
#cp0103 .work_contents_lower .gray_block p {
width: calc(100% - 100px);
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
#cp0103 .work_contents_lower .gray_block p {
width: 100%;
}
}
#cp0103 .work_contents_lower .gray_block img {
position: absolute;
width: 235px;
height: auto;
right: -117.5px;
bottom: 0;
}
@media screen and (max-width: 991px) {
#cp0103 .work_contents_lower .gray_block img {
width: 200px;
}
}
@media screen and (max-width: 767px) {
#cp0103 .work_contents_lower .gray_block img {
width: 40vw;
top: -43vw;
bottom: auto;
left: calc(50% - 20vw);
right: auto;
}
}
#cp0103 section.comparison {
padding: 50px 0 80px;
background: #fafafa;
}
#cp0103 section.comparison p {
color: #585858;
font-size: 16px;
line-height: 1.5;
min-height: 3em;
display: flex;
justify-content: center;
align-items: center;
margin: 1em 0 0 0;
}
@media screen and (max-width: 995px) {
#cp0103 section.comparison p {
font-size: 13px;
}
}
@media screen and (max-width: 767px) {
#cp0103 section.comparison p {
font-size: 2vw;
}
}
#cp0103 section.comparison th {
text-align: center;
border-bottom: solid 10px #ededed;
}
@media screen and (max-width: 767px) {
#cp0103 section.comparison th {
padding: 1em 0;
}
}
#cp0103 section.comparison td {
text-align: center;
border-bottom: solid 4px #ededed;
}
@media screen and (max-width: 767px) {
#cp0103 section.comparison td {
padding: 1em 0;
}
}
#cp0103 section.comparison th.helpyou,
#cp0103 section.comparison td.helpyou {
background: #ffeaea;
width: 27%;
}
@media screen and (max-width: 767px) {
#cp0103 section.comparison th.helpyou {
padding: 1em 0.5em;
}
}
#cp0103 section.comparison th.others {
padding: 20px 2em 0;
}
@media screen and (max-width: 995px) {
#cp0103 section.comparison th.others {
padding: 20px 1% 0;
}
}
#cp0103 section.comparison td.others {
padding: 0 2em;
}
@media screen and (max-width: 995px) {
#cp0103 section.comparison td.others {
padding: 0 1%;
}
}
#cp0103 section.comparison th.others.last,
#cp0103 section.comparison td.others.last {
padding-left: 0;
padding-right: 0;
}
#cp0103 section.comparison .bg_white {
background: #fff;
padding: 1em;
}
@media screen and (max-width: 767px) {
#cp0103 section.comparison .bg_white {
padding: 1em 0;
}
}
#cp0103 tr:last-child th,
#cp0103 tr:last-child td {
border-bottom: none;
padding: 0;
height: 20px;
}
#cp0103 tr:last-child .bg_white {
padding: 0;
height: 20px;
}
#cp0103 .icon {
max-width: 48px;
width: 33%;
}
#cp0103 .td_icon {
max-width: 58px;
width: 40%;
}
#cp0103 section.feature {
background: #efeaea;
padding: 60px 0;
}
@media screen and (max-width: 767px) {
#cp0103 section.feature .container {
padding: 0;
}
}
#cp0103 section.feature h2.sec_title {
margin-bottom: 20px;
}
#cp0103 section.feature .reason {
text-align: center;
margin-bottom: 60px;
}
#cp0103 section.feature .reason img {
width: 152px;
height: auto;
margin-right: 1em;
vertical-align: middle;
}
#cp0103 section.feature .reason p {
vertical-align: middle;
display: inline-block;
font-size: 22px;
margin: 0;
}
#cp0103 section.feature .item {
padding: 23px 20% 0 13%;
position: relative;
margin-bottom: 90px;
height: 500px;
z-index: 3;
}
@media screen and (max-width: 991px) {
#cp0103 section.feature .item {
padding: 23px 22% 0 18%;
}
}
@media screen and (max-width: 767px) {
#cp0103 section.feature .item {
margin: 0 auto 90px;
padding: 23px 80px 0 80px;
}
}
@media screen and (max-width: 580px) {
#cp0103 section.feature .item {
margin: 0 auto 15vw;
padding: 23px 60px 0 60px;
height: 100vw;
}
}
#cp0103 section.feature .item .skew { width: calc(100% - 137.974px);
height: 100%;
position: absolute;
top: 0; left: 68.9873px;
border: solid 10px #c60000;
transform: skewX(15deg);
background: url(//help-you.me/wp1/wp-content/themes/hy/img/cp0103/bg_puzzle.png) no-repeat right bottom;
background-size: 300px auto;
z-index: -1;
}
@media screen and (max-width: 767px) {
#cp0103 section.feature .item .skew {
background-size: 50% auto;
transform: skewX(10deg);
width: calc(100% - 88px);
left: 44px;
}
}
@media screen and (max-width: 580px) {
#cp0103 section.feature .item .skew {
transform: skewX(8deg);
width: calc(100% - 70px);
left: 35px;
}
}
#cp0103 section.feature .item .skew:before {
content: "";
display: block;
position: absolute;
top: 0;
left: -1px;
width: 0;
height: 0;
border-style: solid;
border-width: 120px 150px 0 0;
border-color: #c60000 transparent transparent transparent;
}
@media screen and (max-width: 991px) {
#cp0103 section.feature .item .skew:before {
border-width: 100px 125px 0 0;
}
}
@media screen and (max-width: 767px) {
#cp0103 section.feature .item .skew:before {
border-width: 18vw 23vw 0 0;
}
}
#cp0103 section.feature .item_number {
position: absolute;
color: #fff;
top: 20px;
left: 30px;
font-size: 55px;
font-weight: bold;
}
@media screen and (max-width: 991px) {
#cp0103 section.feature .item_number {
font-size: 45px;
top: 10px;
left: 35px;
}
}
@media screen and (max-width: 767px) {
#cp0103 section.feature .item_number {
font-size: 8vw;
top: 1vw;
left: 6vw;
}
}
#cp0103 section.feature .heading {
background: #fff;
padding: 25px 10px 15px 35px;
margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
#cp0103 section.feature .heading {
padding: 25px 10px 15px 1em;
margin: 0 1em 2em 1em;
}
}
#cp0103 section.feature .item h3 {
color: #585858;
position: relative;
font-size: 28px;
z-index: 1;
}
@media screen and (max-width: 991px) {
#cp0103 section.feature .item h3 {
font-size: 23px;
}
}
@media screen and (max-width: 580px) {
#cp0103 section.feature .item h3 {
font-size: 3.1vw;
}
}
#cp0103 section.feature .item h3:after {
content: "";
width: 100%;
height: 7px;
background: rgba(199, 181, 36, 0.3);
position: absolute;
bottom: 6px;
left: 0;
z-index: -1;
}
#cp0103 section.feature .item p {
color: #585858;
margin-bottom: 0;
font-size: 15px;
}
@media screen and (max-width: 991px) {
#cp0103 section.feature .item p {
font-size: 14px;
}
}
@media screen and (max-width: 580px) {
#cp0103 section.feature .item p {
font-size: 2.5vw;
}
}
#cp0103 section.feature .item li {
color: #585858;
text-indent: -1em;
margin-left: 1em;
font-size: 15px;
}
@media screen and (max-width: 991px) {
#cp0103 section.feature .item li {
font-size: 14px;
}
}
@media screen and (max-width: 580px) {
#cp0103 section.feature .item li {
font-size: 2.5vw;
}
}
#cp0103 section.feature .item li:before {
content: "・";
}
#cp0103 section.voice {
background: #efeaea;
padding: 0 0 80px;
margin-bottom: 180px;
}
#cp0103 section.voice h2 {
color: #585858;
text-align: center;
font-size: 28px;
margin-bottom: 2em;
}
#cp0103 .voice_item {
display: flex;
flex-wrap: wrap;
align-items: center;
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
#cp0103 .voice_item {
align-items: flex-start;
}
}
@media screen and (max-width: 580px) {
#cp0103 .voice_item {
justify-content: center;
}
}
#cp0103 .voice_left {
width: 180px;
background: #585858;
padding: 0 10px 20px;
text-align: center;
}
@media screen and (max-width: 767px) {
#cp0103 .voice_left {
width: 30%;
padding: 0 10px 10%;
}
}
@media screen and (max-width: 580px) {
#cp0103 .voice_left {
width: 70%;
padding: 0 10px 10%;
}
}
#cp0103 .voice_left img {
width: 129px;
height: auto;
margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
#cp0103 .voice_left img {
width: 85%;
}
}
#cp0103 .voice_left p {
color: #fff;
text-align: left;
font-size: 16px;
margin-bottom: 0;
line-height: 1.3;
}
@media screen and (max-width: 767px) {
#cp0103 .voice_left p {
font-size: 2.5vw;
}
}
@media screen and (max-width: 580px) {
#cp0103 .voice_left p {
font-size: 4vw;
text-align: center;
}
}
#cp0103 .voice_right {
width: calc(100% - 180px);
}
@media screen and (max-width: 767px) {
#cp0103 .voice_right {
width: 70%;
}
}
@media screen and (max-width: 580px) {
#cp0103 .voice_right {
width: 100%;
}
}
#cp0103 .voice_right p {
margin-bottom: 0;
margin: 1em 0;
background: #fff;
line-height: 1.6;
padding: 1.5em 1em;
color: #585858;
min-height: 15em;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}
@media screen and (max-width: 991px) {
#cp0103 .voice_right p {
min-height: 20em;
}
}
@media screen and (max-width: 580px) {
#cp0103 .voice_right p {
margin-top: 0;
}
}
.blog-contact-btn {
margin: 0 auto;
width: 250px;
text-align: center;
color: #fff;
background: #c00;
padding: 0.5em;
border-radius: 5px;
display: block;
text-decoration: none !important;
margin-bottom: 2em;
}
.blog-contact-btn:hover {
opacity: 0.5;
}
.blog-contact-btn:hover,
.blog-contact-btn:active,
.blog-contact-btn:focus {
color: #fff;
} #telework_lp {
word-break: normal;
line-break: strict;
}
#telework_lp section {
padding: 5vw 0 calc(50px + 5vw);
position: relative;
}
#telework_lp img {
height: auto;
}
#telework_lp .inner {
width: 95%;
max-width: 1000px;
margin: 0 auto;
}
#telework_lp .bg-white {
background: #fff;
}
#telework_lp .bg-gray-dots {
background: #eaefed url(//help-you.me/wp1/wp-content/themes/hy/img/telework/bg_gray_dots.png) repeat;
}
#telework_lp .bg-gray {
background: #eaefed;
}
#telework_lp section.bg-gray-dots {
padding: calc(50px + 5vw) 0 calc(50px + 5vw);
}
#telework_lp section.bg-white {
padding: 50px 0 50px;
}
#telework_lp section.bg-white:before {
content: "";
display: block;
position: absolute;
top: -5vw;
left: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 5vw 100vw;
border-color: transparent transparent #fff transparent;
}
#telework_lp section.bg-white:not(#contact):after {
content: "";
display: block;
position: absolute;
bottom: -5vw;
left: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 5vw 100vw 0 0;
border-color: #fff transparent transparent transparent;
z-index: 10;
}
#telework_lp .bg-gray-pattern {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar/bg_pattern.png) repeat;
}
#telework_lp .bg-blue {
background: #74aedf;
}
#telework_lp .bg-black {
background: #000;
}
#telework_lp .bg-mintgreen {
background: #53c0b4;
}
#telework_lp .bg-darkgreen {
background: #558773;
}
#telework_lp .txt-white {
color: #fff;
}
#telework_lp .txt-blue {
color: #74aedf;
}
#telework_lp .txt-black {
color: #333333;
}
#telework_lp .txt-mintgreen {
color: #4aaca1;
}
#telework_lp .txt-darkgreen {
color: #558773;
}
#telework_lp .txt-yellow {
color: #fff600;
}
#telework_lp .sec-title {
text-align: center;
margin-bottom: 2.5em;
font-weight: bold;
letter-spacing: 0.1em;
line-height: 1.5;
position: relative;
}
#telework_lp .sec-title:after {
content: "";
width: 30px;
height: 3px;
background: #53c0b4;
position: absolute;
bottom: -7px;
left: calc(50% - 15px);
}
#telework_lp .mv {
width: 100%;
height: 53.9583vw;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/telework/mv.png) center no-repeat;
background-size: cover;
display: flex;
justify-content: center;
align-items: center;
}
@media screen and (max-width: 767px) {
#telework_lp .mv {
height: 75vw;
}
}
@media screen and (max-width: 498px) {
#telework_lp .mv {
height: 100vw;
}
}
#telework_lp .mv .mv-txt {
text-align: center;
width: 95%;
}
#telework_lp .mv h1 {
display: inline-block;
background: #4aaca1;
font-size: 50px;
margin: 0 0 15px;
line-height: 1.3;
padding: 10px;
font-weight: bold;
}
@media screen and (max-width: 1000px) {
#telework_lp .mv h1 {
font-size: 40px;
margin: 0 0 20px;
}
}
@media screen and (max-width: 767px) {
#telework_lp .mv h1 {
font-size: 5.5vw;
margin: 0 0 20px;
padding: 1.5vw;
}
}
#telework_lp .mv h1 span {
font-size: inherit;
}
#telework_lp .mv h1 span:before {
display: none;
}
#telework_lp .mv h2 {
display: inline-block;
background: #4aaca1;
font-size: 28px;
margin: 0;
line-height: 1.3;
padding: 20px;
font-weight: bold;
}
@media screen and (max-width: 1000px) {
#telework_lp .mv h2 {
font-size: 22px;
padding: 10px;
}
}
@media screen and (max-width: 767px) {
#telework_lp .mv h2 {
font-size: 3.5vw;
padding: 1.5vw;
}
}
#telework_lp #application {
text-align: center;
}
#telework_lp #application h3 {
margin-bottom: 0.5em;
line-height: 1.3;
}
#telework_lp #application h4 {
margin-bottom: 1em;
}
#telework_lp #mind {
text-align: left;
}
#telework_lp .mind-wrapper {
display: flex;
justify-content: space-between;
align-items: flex-end;
flex-wrap: wrap;
}
#telework_lp .mind-message {
width: calc(100% - 385px);
}
@media screen and (max-width: 1000px) {
#telework_lp .mind-message {
width: calc(95% - 290px);
}
}
@media screen and (max-width: 767px) {
#telework_lp .mind-message {
width: 100%;
margin-bottom: 30px;
}
}
#telework_lp .mind-message p {
line-height: 1.5;
}
#telework_lp .mind-profile {
width: 340px;
text-align: center;
}
@media screen and (max-width: 1000px) {
#telework_lp .mind-profile {
width: 290px;
}
}
@media screen and (max-width: 767px) {
#telework_lp .mind-profile {
width: 100%;
}
}
#telework_lp .mind-profile .heading {
display: inline-block;
text-align: right;
}
#telework_lp .mind-profile img {
width: 160px;
height: auto;
}
#telework_lp .mind-profile-txt {
margin-top: -80px;
}
@media screen and (max-width: 767px) {
#telework_lp .mind-profile-txt {
width: 100%;
text-align: center;
}
}
#telework_lp .mind-profile-txt h4 {
margin: 0 0 0.8em 0;
display: inline-block;
padding: 0.1em 2em;
font-size: 17px;
letter-spacing: 0.1em;
}
@media screen and (max-width: 1000px) {
#telework_lp .mind-profile-txt h4 {
padding: 0.1em 1em;
font-size: 16px;
}
}
#telework_lp .mind-profile-txt h5.title {
margin-bottom: 0.8em;
}
#telework_lp .mind-profile-txt p {
font-size: 14px;
margin: -0.5em 0 0;
width: 100%;
line-height: 2;
text-align: left;
}
@media screen and (max-width: 1000px) {
#telework_lp .mind-profile-txt p {
line-height: 1.7;
}
}
@media screen and (max-width: 767px) {
#telework_lp .mind-profile-txt p {
max-width: inherit;
text-align: left;
margin-top: 0;
}
}
#telework_lp a:hover {
opacity: 0.7;
}
#telework_lp p {
font-size: 18px;
}
@media screen and (max-width: 1000px) {
#telework_lp p {
font-size: 16px;
}
}
#telework_lp .app-btn {
display: inline-block;
margin: 0 auto;
padding: 1.5em 1em;
position: relative;
width: 340px;
font-size: 20px;
text-decoration: none;
border-radius: 0;
border: 2px solid #53c0b4;
background: transparent;
color: #4aaca1;
background: #fff;
}
@media screen and (max-width: 498px) {
#telework_lp .app-btn {
width: 100%;
}
}
#telework_lp .app-btn:after,
#telework_lp #contact .app-btn-wrapper:after {
content: "";
display: block;
width: 21px;
height: 60px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/telework/green_r_arrow.png) center no-repeat;
background-size: contain;
position: absolute;
right: 17px;
top: 17px;
}
#telework_lp .app-btn:hover {
opacity: 0.7;
}
#telework_lp .mv .app-btn {
margin-top: 30px;
border: none;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
padding: 1em 1em;
max-width: 300px;
width: 100%;
}
@media screen and (max-width: 498px) {
#telework_lp .mv .app-btn {
font-size: 17px;
}
}
#telework_lp .mv .app-btn:after {
height: 40px;
top: 15px;
}
@media screen and (max-width: 498px) {
#telework_lp .mv .app-btn:after {
height: 35px;
top: 13px;
}
}
#telework_lp #solution .block-title {
font-weight: bold;
margin-bottom: 1em;
line-height: 1.5;
}
#telework_lp #solution .block {
display: flex;
justify-content: space-between;
flex-wrap: nowrap;
}
@media screen and (max-width: 1000px) {
#telework_lp #solution .block {
flex-wrap: wrap;
justify-content: center;
}
}
#telework_lp #solution .block > li {
width: 48%;
position: relative;
padding: 20px;
text-align: center;
}
@media screen and (max-width: 1000px) {
#telework_lp #solution .block > li {
width: 100%;
max-width: 600px;
margin-bottom: 10px;
}
}
#telework_lp #solution .block > li:first-child {
border: 2px solid #53c0b4;
}
#telework_lp #solution .block > li:last-child {
background-color: #f8f8f8 !important;
}
#telework_lp #solution .block > li:last-child:after {
content: "After";
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: -30px;
right: -30px;
background: #fff600;
color: #53c0b4;
border-radius: 50px;
width: 100px;
height: 100px;
font-size: 24px;
}
@media screen and (max-width: 767px) {
#telework_lp #solution .block > li:last-child:after {
right: -5px;
border-radius: 45px;
width: 80px;
height: 80px;
font-size: 20px;
}
}
#telework_lp #solution .block > li:nth-child(2) {
width: 4%;
display: flex;
justify-content: center;
align-items: center;
padding: 0;
}
@media screen and (max-width: 1000px) {
#telework_lp #solution .block > li:nth-child(2) {
width: 100%;
}
}
#telework_lp #solution .block > li:nth-child(2) img {
max-width: 25px;
width: 80%;
}
@media screen and (max-width: 1000px) {
#telework_lp #solution .block > li:nth-child(2) img {
transform: rotate(90deg);
}
}
#telework_lp #solution .block > li h4 {
height: auto;
margin-bottom: 0.5em;
display: inline-block;
padding: 0 1em;
}
#telework_lp #solution p {
display: inline-block;
text-align: left;
}
#telework_lp #solution .list {
text-align: left;
display: inline-block;
}
#telework_lp #solution .list li {
font-size: 16px;
position: relative;
margin-left: 17px;
line-height: 1.3;
padding: 0.5em 0;
}
#telework_lp #solution .list li:before {
content: "";
display: block;
width: 7px;
height: 19px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/telework/green_slash.png) center no-repeat;
background-size: contain;
position: absolute;
left: -17px;
top: 5px;
}
#telework_lp #plan-flow li {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
padding: 0;
margin-bottom: 20px;
position: relative;
}
@media screen and (max-width: 900px) {
#telework_lp #plan-flow li {
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
}
@media screen and (max-width: 498px) {
#telework_lp #plan-flow li {
justify-content: center;
}
}
#telework_lp #plan-flow li .left-block {
color: #fff;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;
padding: 10px 20px;
width: 240px;
}
@media screen and (max-width: 1000px) {
#telework_lp #plan-flow li .left-block {
width: 200px;
}
}
@media screen and (max-width: 900px) {
#telework_lp #plan-flow li .left-block {
width: 100%;
justify-content: center;
}
}
#telework_lp #plan-flow li .right-block {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
padding: 10px 20px;
width: calc(100% - 240px);
border: 2px solid #53c0b4;
}
@media screen and (max-width: 1000px) {
#telework_lp #plan-flow li .right-block {
width: calc(100% - 200px);
}
}
@media screen and (max-width: 900px) {
#telework_lp #plan-flow li .right-block {
width: 100%;
justify-content: center;
text-align: center;
}
}
#telework_lp #plan-flow li:after {
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 19px 21px 0 21px;
border-color: #a7dbc7 transparent transparent transparent;
position: absolute;
bottom: -19px;
left: calc(50% - 20px);
}
#telework_lp #plan-flow li.last-step {
margin-bottom: 0;
}
#telework_lp #plan-flow li.last-step:after {
display: none;
}
#telework_lp #plan-flow li .step-number {
margin: 0;
letter-spacing: 0.2em;
font-weight: bold;
}
@media screen and (max-width: 767px) {
#telework_lp #plan-flow li .step-number {
margin-right: 2%;
}
}
@media screen and (max-width: 498px) {
#telework_lp #plan-flow li .step-number {
width: 100%;
text-align: center;
margin-right: 0;
}
}
#telework_lp #plan-flow li .step-title {
width: 40%;
font-weight: bold;
line-height: 1.3;
}
@media screen and (max-width: 900px) {
#telework_lp #plan-flow li .step-title {
width: 100%;
text-align: center;
margin-bottom: 0.3em;
}
}
#telework_lp #plan-flow li p {
width: 60%;
margin: 0;
line-height: 1.5;
}
@media screen and (max-width: 900px) {
#telework_lp #plan-flow li p {
width: auto;
display: inline-block;
text-align: left;
}
}
@media screen and (max-width: 767px) {
#telework_lp #plan-flow li p {
width: auto;
}
}
#telework_lp #plan-flow .step-icon img {
width: 66px;
height: auto;
}
#telework_lp #kickoff-outline .title-wrapper {
text-align: center;
margin-bottom: 0.5rem;
}
#telework_lp #kickoff-outline .title {
font-weight: bold;
line-height: 1.4;
margin-bottom: 0.5em;
display: inline-block;
padding: 0 0.5em;
}
#telework_lp #kickoff-outline .title.forSP {
display: none;
}
#telework_lp .training-outline-block {
position: relative;
margin-top: 20px;
}
#telework_lp .training-outline-block .item {
border: 2px solid #fff;
border-bottom: none;
margin: 0;
padding: 0;
background: #fff;
}
#telework_lp .training-outline-block .item:first-child {
border-bottom: none;
padding-bottom: 1em;
}
#telework_lp .training-outline-block .col2 .item:first-child,
#telework_lp .training-outline-block .col2 .item:last-child {
border-top: 2px solid #eaefed;
border-bottom: none;
}
#telework_lp .training-outline-block .item:last-child {
border-top: 2px solid #eaefed;
border-bottom: 2px solid #fff;
}
#telework_lp .training-outline-block .col2 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#telework_lp .training-outline-block .col2 .item {
width: 50%;
}
@media screen and (max-width: 767px) {
#telework_lp .training-outline-block .col2 .item {
width: 100%;
}
}
#telework_lp .training-outline-block .col2 .item:first-child {
border-right: none;
}
#telework_lp .training-outline-block .col2 .item:last-child {
border-left: none;
border-bottom: none;
}
@media screen and (max-width: 767px) {
#telework_lp .training-outline-block .col2 .item:last-child {
border-left: 2px solid #fff;
}
}
#telework_lp .training-outline-block .sub-title {
width: 180px;
font-size: 20px;
text-align: center;
padding: 0.5em;
margin: 0;
letter-spacing: 0.1em;
font-weight: bold;
border-right: 2px solid #fff;
box-sizing: border-box;
}
@media screen and (max-width: 498px) {
#telework_lp .training-outline-block .sub-title {
width: 110px;
font-size: 17px;
letter-spacing: none;
}
}
#telework_lp .training-outline-block .sub-title-wrapper {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#telework_lp .training-outline-block .sub-title01 {
width: 180px;
}
@media screen and (max-width: 498px) {
#telework_lp .training-outline-block .sub-title01 {
width: 70px;
}
}
#telework_lp .training-outline-block .sub-title02 {
width: calc(100% - 180px);
border-right: none;
}
@media screen and (max-width: 498px) {
#telework_lp .training-outline-block .sub-title02 {
width: calc(100% - 70px);
}
}
#telework_lp .training-outline-block .txt {
padding: 0.5em 2em;
line-height: 1.5;
margin: 0;
font-size: 16px;
}
@media screen and (max-width: 767px) {
#telework_lp .training-outline-block .txt {
padding: 0.5em 1em;
}
}
@media screen and (max-width: 498px) {
#telework_lp .training-outline-block .txt {
font-size: 15px;
}
}
#telework_lp .training-outline-block .txt li {
text-indent: -1em;
margin-left: 1em;
}
#telework_lp .training-outline-block table {
margin: 0.5em 2em;
width: auto;
}
@media screen and (max-width: 767px) {
#telework_lp .training-outline-block table {
margin: 0.5em 1em;
}
}
#telework_lp .training-outline-block th,
#telework_lp .training-outline-block td {
border: none;
line-height: 1.5;
font-size: 16px;
padding: 0.2em 1em 0.2em 0.5em;
vertical-align: top;
}
#telework_lp .training-outline-block th {
min-width: 130px;
}
@media screen and (max-width: 767px) {
#telework_lp .training-outline-block th,
#telework_lp .training-outline-block td {
padding: 0.2em 0.5em;
}
}
@media screen and (max-width: 498px) {
#telework_lp .training-outline-block th {
display: block;
padding: 0.5em 0.5em 0;
}
#telework_lp .training-outline-block td {
display: block;
padding: 0 0.5em 0.5em 2em;
}
}
#telework_lp #kickoff-flow .note {
text-align: center;
}
#telework_lp .training-flow {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
@media screen and (max-width: 1000px) {
#telework_lp .training-flow {
display: block;
}
}
#telework_lp .training-flow-item {
position: relative;
margin-bottom: 20px;
width: calc((100% - 80px) / 5);
background: #fff;
}
@media screen and (max-width: 1000px) {
#telework_lp .training-flow-item {
width: 100%;
max-width: 400px;
margin-left: auto;
margin-right: auto;
}
}
#telework_lp .training-flow-item:after {
content: "";
display: block;
position: absolute;
right: -20px;
top: 90px;
width: 0;
height: 0;
border-style: solid;
border-width: 20px 0 20px 20px;
border-color: transparent transparent transparent #a7dbc7;
}
@media screen and (max-width: 1000px) {
#telework_lp .training-flow-item:after {
left: calc(50% - 20px);
top: 100%;
border-width: 20px 20px 0 20px;
border-color: #a7dbc7 transparent transparent transparent;
}
}
#telework_lp .training-flow-item:last-child:after {
display: none;
}
#telework_lp .training-flow-item-upper {
background: #53c0b4;
color: #fff;
padding: 0.5em 5%;
height: 200px;
}
@media screen and (max-width: 1000px) {
#telework_lp .training-flow-item-upper {
padding: 0.5em 5% 20px;
height: auto;
}
}
#telework_lp .training-flow-item-lower {
padding: 1em 5%;
}
@media screen and (max-width: 1000px) {
#telework_lp .training-flow-item-lower {
text-align: center;
}
#telework_lp .training-flow-item-lower ul {
display: inline-block;
width: auto;
text-align: left;
}
#telework_lp .training-flow-item-lower br {
display: none;
}
}
#telework_lp .training-flow-item .training-step {
font-weight: bold;
margin-bottom: 0;
font-size: 14px;
letter-spacing: 0.1em;
}
#telework_lp .training-flow-item .duration {
margin-bottom: 2em;
font-size: 16px;
letter-spacing: 0.1em;
line-height: 1.3;
}
@media screen and (max-width: 1000px) {
#telework_lp .training-flow-item .duration {
margin-bottom: 1em;
}
}
#telework_lp .training-flow-item h4 {
text-align: center;
font-weight: bold;
font-size: 23px;
}
#telework_lp .training-flow-item li {
text-indent: -1.5em;
padding-left: 1.5em;
margin-bottom: 0.5em;
line-height: 1.5;
}
#telework_lp .training-flow-item .duration .number {
font-size: 20px;
}
#telework_lp .training-flow-btn {
text-align: center;
margin-top: 30px;
}
#telework_lp .training-flow-btn #see-doc-btn {
font-size: 20px;
letter-spacing: 0.1em;
padding: 0.5em 3em;
display: inline-block;
text-decoration: none;
border: 2px solid #53c0b4;
position: relative;
cursor: pointer;
}
#telework_lp .training-flow-btn #see-doc-btn:hover {
opacity: 0.7;
}
#telework_lp .training-flow-btn #see-doc-btn:after {
content: "";
display: block;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/telework/green_r_arrow_s.png) center no-repeat;
width: 13px;
height: 25px;
background-size: contain;
position: absolute;
top: 13px;
right: 16px;
}
#telework_lp .satisfaction-outer-block {
padding: 40px 2%;
background: #a6dbc6;
padding: 50px 10% 30px;
}
@media screen and (max-width: 767px) {
#telework_lp .satisfaction-outer-block {
padding: 50px 5% 30px;
}
}
#telework_lp .satisfaction-outer-block h4 {
text-align: center;
margin-bottom: 1em;
font-weight: bold;
}
@media screen and (max-width: 498px) {
#telework_lp .satisfaction-outer-block h4 {
font-size: 18px;
}
}
#telework_lp .satisfaction-inner-block {
padding: 30px 4%;
}
@media screen and (max-width: 767px) {
#telework_lp .satisfaction-inner-block {
justify-content: center;
}
}
#telework_lp .satisfaction-inner-block .balloon-list li {
display: flex;
justify-content: space-between;
flex-wrap: nowrap;
align-items: flex-start;
margin-bottom: 1em;
}
#telework_lp .satisfaction-inner-block .icon {
width: 50px;
height: auto;
margin-top: 10px;
}
@media screen and (max-width: 767px) {
#telework_lp .satisfaction-inner-block .icon {
width: 40px;
margin-top: 10px;
}
}
#telework_lp .satisfaction-inner-block .balloon {
width: calc(100% - 56px);
position: relative;
padding: 7px 10px;
border: solid 3px #a6dbc6;
border-radius: 10px;
min-height: 66px;
display: flex;
justify-content: left;
align-items: center;
}
@media screen and (max-width: 767px) {
#telework_lp .satisfaction-inner-block .balloon {
width: calc(100% - 46px);
}
}
#telework_lp .satisfaction-inner-block .balloon:before {
content: "";
position: absolute;
top: 30px;
left: -10px;
margin-top: -4px;
border: 4px solid transparent;
border-right: 6px solid #fff;
z-index: 2;
}
#telework_lp .satisfaction-inner-block .balloon:after {
content: "";
position: absolute;
top: 30px;
left: -16px;
margin-top: -6px;
border: 6px solid transparent;
border-right: 8px solid #a6dbc6;
z-index: 1;
}
#telework_lp .satisfaction-inner-block p {
color: #74aedf;
line-height: 1.5;
font-size: 13px;
padding-left: 56px;
margin: 0;
}
@media screen and (max-width: 767px) {
#telework_lp .satisfaction-inner-block p {
padding-left: 46px;
}
}
#telework_lp #price {
padding-bottom: 0;
}
#telework_lp #price:after {
display: none;
}
#telework_lp #price .description {
text-align: center;
font-size: 22px;
letter-spacing: 0.05em;
}
@media screen and (max-width: 767px) {
#telework_lp #price .description {
letter-spacing: 0;
}
}
@media screen and (max-width: 498px) {
#telework_lp #price .description {
font-size: 18px;
}
}
#telework_lp #price .underline {
display: inline-block;
position: relative;
border-bottom: 2px solid #53c0b4;
line-height: 1.1;
color: #000;
text-decoration: none;
}
#telework_lp #price .underline:after {
content: "(厚生省HP)";
font-size: 12px;
position: absolute;
top: 26px;
right: 0;
}
#telework_lp #price .link-icon {
position: relative;
bottom: 2px;
left: 6px;
}
#telework_lp .green-block {
background: #a6dbc6;
padding: 50px 10%;
}
@media screen and (max-width: 767px) {
#telework_lp .green-block {
padding: 40px 5%;
}
}
@media screen and (max-width: 498px) {
#telework_lp .green-block {
padding: 40px 10px;
}
}
#telework_lp #price th {
border: none;
padding: 0;
}
#telework_lp #price td {
border: none;
padding: 0;
}
#telework_lp #price .heading {
width: 20%;
min-width: 150px;
}
@media screen and (max-width: 767px) {
#telework_lp #price .heading {
min-width: 100px;
}
}
@media screen and (max-width: 498px) {
#telework_lp #price .heading {
min-width: 65px;
}
}
#telework_lp #price .price-col {
width: 40%;
}
#telework_lp #price th .bg-darkgreen {
font-weight: bold;
text-align: center;
margin: 0 0 15px 12px;
padding: 0.3em 0.5em;
font-size: 20px;
color: #fff;
}
@media screen and (max-width: 1000px) {
#telework_lp #price th .bg-darkgreen {
font-size: 18px;
}
}
@media screen and (max-width: 498px) {
#telework_lp #price th .bg-darkgreen {
font-size: 14px;
margin: 0 0 10px 8px;
}
}
#telework_lp #price td .bg-white {
height: 80px;
display: flex;
justify-content: center;
align-items: center;
margin: 5px 0;
font-size: 18px;
letter-spacing: 0.1em;
}
@media screen and (max-width: 1000px) {
#telework_lp #price td .bg-white {
font-size: 16px;
}
}
@media screen and (max-width: 498px) {
#telework_lp #price td .bg-white {
font-size: 13px;
letter-spacing: 0;
}
}
#telework_lp #price .unit {
position: relative;
bottom: -7px;
}
#telework_lp #price .number {
font-size: 38px;
color: #558773;
font-weight: bold;
margin-left: 12px;
}
@media screen and (max-width: 1000px) {
#telework_lp #price .number {
font-size: 34px;
}
}
@media screen and (max-width: 498px) {
#telework_lp #price .number {
font-size: 28px;
}
}
#telework_lp #price .small {
font-size: 15px;
}
@media screen and (max-width: 1000px) {
#telework_lp #price .small {
font-size: 14px;
}
}
@media screen and (max-width: 498px) {
#telework_lp #price .small {
font-size: 12px;
}
}
#telework_lp #price-ex {
padding-bottom: 0;
}
#telework_lp #price-ex:before {
display: none;
}
#telework_lp #price-ex:after {
display: none;
}
#telework_lp #price-ex .green-block {
padding: 90px 10%;
}
@media screen and (max-width: 767px) {
#telework_lp #price-ex .green-block {
padding: 70px 5%;
}
}
@media screen and (max-width: 498px) {
#telework_lp #price-ex .green-block {
padding: 70px 10px;
}
}
#telework_lp .price-ex-block {
padding: 20px 30px;
}
@media screen and (max-width: 498px) {
#telework_lp .price-ex-block {
padding: 20px 15px;
}
}
#telework_lp .price-ex-block h4 {
text-align: center;
padding: 0 10px;
}
#telework_lp .price-ex-formula {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: nowrap;
margin: 20px auto 20px;
max-width: 450px;
letter-spacing: 0.1em;
}
@media screen and (max-width: 767px) {
#telework_lp .price-ex-formula {
margin: 42px auto 20px;
}
}
#telework_lp .price-ex-formula .number {
font-size: 38px;
font-weight: bold;
}
@media screen and (max-width: 767px) {
#telework_lp .price-ex-formula .number {
font-size: 32px;
justify-content: center;
}
}
@media screen and (max-width: 498px) {
#telework_lp .price-ex-formula .number {
font-size: 25px;
}
}
#telework_lp .price-ex-formula .sign {
font-size: 32px;
}
@media screen and (max-width: 767px) {
#telework_lp .price-ex-formula .sign {
font-size: 28px;
}
}
@media screen and (max-width: 498px) {
#telework_lp .price-ex-formula .sign {
font-size: 22px;
}
}
#telework_lp .price-ex-formula .unit {
font-size: 18px;
}
@media screen and (max-width: 767px) {
#telework_lp .price-ex-formula .unit {
font-size: 17px;
}
}
@media screen and (max-width: 498px) {
#telework_lp .price-ex-formula .unit {
font-size: 15px;
}
}
#telework_lp .price-ex-formula .group1,
#telework_lp .price-ex-formula .group2,
#telework_lp .price-ex-formula .group3 {
position: relative;
}
#telework_lp .price-ex-formula .group1:before {
content: "合計";
}
#telework_lp .price-ex-formula .group2:before {
content: "講師料";
}
#telework_lp .price-ex-formula .group3:before {
content: "受講料（1万円×10人）";
}
#telework_lp .price-ex-formula .group1:before,
#telework_lp .price-ex-formula .group2:before,
#telework_lp .price-ex-formula .group3:before {
position: absolute;
width: 100%;
text-align: center;
letter-spacing: 0;
font-size: 14px;
top: -3px;
left: 0;
line-height: 1.3;
}
#telework_lp .price-ex-formula .group3:before {
width: 150px;
left: calc(50% - 75px);
}
@media screen and (max-width: 767px) {
#telework_lp .price-ex-formula .group1:before,
#telework_lp .price-ex-formula .group2:before,
#telework_lp .price-ex-formula .group3:before {
font-size: 13.5px;
top: -5px;
}
#telework_lp .price-ex-formula .group3:before {
width: 140px;
left: calc(50% - 70px);
content: "受講料\A（1万円×10人）";
white-space: pre;
top: -22px;
}
}
@media screen and (max-width: 498px) {
#telework_lp .price-ex-formula .group1:before,
#telework_lp .price-ex-formula .group2:before,
#telework_lp .price-ex-formula .group3:before {
font-size: 12px;
top: -5px;
}
#telework_lp .price-ex-formula .group3:before {
top: -20px;
}
}
#telework_lp .price-ex-block li {
text-indent: -1.2em;
margin-left: 1.2em;
text-align: left;
}
#telework_lp #option:before {
display: none;
}
#telework_lp #option .green-block {
padding: 30px 10%;
}
@media screen and (max-width: 767px) {
#telework_lp #option .green-block {
padding: 20px 5%;
}
}
@media screen and (max-width: 498px) {
#telework_lp #option .green-block {
padding: 20px 10px;
}
}
#telework_lp .option-block {
padding: 10px 30px;
height: 90px;
margin-bottom: 10px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
line-height: 1.3;
}
@media screen and (max-width: 1000px) {
#telework_lp .option-block {
height: auto;
}
}
@media screen and (max-width: 767px) {
#telework_lp .option-block {
padding: 10px 15px;
}
}
#telework_lp .option-block-left .small {
font-size: 15px;
line-height: 1.3em;
margin: 0.2em 0 0em;
letter-spacing: 0;
text-indent: -1em;
padding-left: 1em;
}
@media screen and (max-width: 650px) {
#telework_lp .option-block-left .small {
font-size: 13px;
}
}
#telework_lp .option-block-left .small.ex {
text-indent: -2em;
padding-left: 2em;
}
#telework_lp .option-block:last-child {
margin-bottom: 0;
height: auto;
}
#telework_lp .option-block:last-child .note {
position: relative;
top: 0;
margin-top: 0.5em;
}
#telework_lp .option-block-left {
width: calc(100% - 200px);
position: relative;
font-size: 20px;
letter-spacing: 0.1em;
}
@media screen and (max-width: 1000px) {
#telework_lp .option-block-left {
width: calc(100% - 170px);
font-size: 18px;
letter-spacing: 0;
}
}
@media screen and (max-width: 650px) {
#telework_lp .option-block-left {
width: calc(100% - 120px);
}
}
@media screen and (max-width: 498px) {
#telework_lp .option-block-left {
font-size: 15px;
width: 100%;
text-align: center;
margin-bottom: 1em;
}
}
#telework_lp .option-block-left .note {
position: absolute;
top: 25px;
font-size: 14px;
letter-spacing: 0;
margin: 0;
line-height: 1.3;
text-indent: -1em;
margin-left: 1em;
}
@media screen and (max-width: 1000px) {
#telework_lp .option-block-left .note {
position: relative;
top: 0;
font-size: 13px;
}
}
@media screen and (max-width: 498px) {
#telework_lp .option-block-left .note {
font-size: 12px;
}
}
#telework_lp .option-block-right {
width: 180px;
position: relative;
font-size: 20px;
letter-spacing: 0.1em;
line-height: 1.3;
}
@media screen and (max-width: 1000px) {
#telework_lp .option-block-right {
width: 150px;
font-size: 18px;
letter-spacing: 0;
}
}
@media screen and (max-width: 650px) {
#telework_lp .option-block-right {
width: 100px;
}
}
@media screen and (max-width: 498px) {
#telework_lp .option-block-right {
font-size: 15px;
width: 100%;
text-align: center;
}
}
#telework_lp .option-block-right .small {
position: absolute;
top: 42px;
font-size: 14px;
letter-spacing: 0;
margin: 0 0 0 calc(0.5em + 27px);
text-indent: -0.5em;
line-height: 1.3;
}
@media screen and (max-width: 1000px) {
#telework_lp .option-block-right .small {
position: relative;
top: -0.3em;
font-size: 13px;
}
}
@media screen and (max-width: 498px) {
#telework_lp .option-block-right .small {
font-size: 12px;
margin: 0 0 0 0.5em;
}
}
#telework_lp .option-block-right .number {
font-size: 38px;
font-weight: bold;
}
@media screen and (max-width: 1000px) {
#telework_lp .option-block-right .number {
font-size: 34px;
}
}
@media screen and (max-width: 498px) {
#telework_lp .option-block-right .number {
font-size: 28px;
}
}
#telework_lp .option-block:last-child .number {
margin-left: 0.6em;
}
#telework_lp .option-block-right .unit {
font-weight: bold;
} #telework_lp .tel {
color: #c72d29;
font-weight: bold;
font-size: 40px;
line-height: 0.8;
letter-spacing: 0.1em;
text-decoration: none;
}
@media screen and (max-width: 498px) {
#telework_lp .tel {
font-size: 28px;
letter-spacing: 0;
}
}
#telework_lp #contact .seminar-form-item {
display: flex;
flex-wrap: nowrap;
margin-bottom: 22px;
}
#telework_lp #contact .seminar-form-item br {
display: none;
}
#telework_lp #contact .seminar-form-item label,
#telework_lp #contact th {
background: #53c0b4;
width: 40%;
padding: 0.8em 2.5%;
font-size: 17px;
letter-spacing: 0.1em;
margin: 0;
font-weight: bold;
color: #fff;
}
@media screen and (max-width: 767px) {
#telework_lp #contact .seminar-form-item label,
#telework_lp #contact th {
font-size: 15px;
letter-spacing: 0;
}
}
#telework_lp #contact th {
vertical-align: top;
}
#telework_lp #contact .seminar-form-item label .small,
#telework_lp #contact th .small {
font-size: 14px;
font-weight: normal;
}
@media screen and (max-width: 767px) {
#telework_lp #contact .seminar-form-item label .small,
#telework_lp #contact th .small {
font-size: 13px;
}
}
#telework_lp #contact .seminar-form-item .wpcf7-form-control-wrap {
width: 60%;
}
#telework_lp #contact .seminar-form-item input,
#telework_lp #contact .seminar-form-item select,
#telework_lp #contact td {
border: 1px solid #53c0b4;
border-radius: 0;
height: 100%;
box-shadow: none;
background: #fff;
}
#telework_lp #contact td p {
margin-bottom: 0;
}
#telework_lp #contact span.wpcf7-list-item {
display: block;
margin: 0;
line-height: 1.5;
}
@media screen and (max-width: 498px) {
#telework_lp #contact span.wpcf7-list-item {
margin: 0;
}
}
#telework_lp .wpcf7 .privacy dl {
background: #fff;
border: 1px solid #53c0b4;
}
#telework_lp #contact .app-btn-outer {
margin: 100px 0 50px;
}
#telework_lp #contact .app-btn-wrapper {
display: inline-block;
position: relative;
max-width: 340px;
width: 100%;
}
#telework_lp .sp_br {
display: none;
}
@media screen and (max-width: 1000px) {
#telework_lp .sp_br {
display: block;
}
}
#telework_lp .sp_br3 {
display: none;
}
@media screen and (max-width: 767px) {
#telework_lp .sp_br3 {
display: block;
}
}
#telework_lp .sp_br2 {
display: none;
}
@media screen and (max-width: 498px) {
#telework_lp .sp_br2 {
display: block;
}
}
@media screen and (max-width: 767px) {
#telework_lp .pc_br {
display: none;
}
}
@media screen and (max-width: 498px) {
#telework_lp .pc_br2 {
display: none;
}
}
@media screen and (max-width: 767px) {
#telework_lp .forPC {
display: none;
}
}
#telework_lp .forSP {
display: none;
}
@media screen and (max-width: 767px) {
#telework_lp .forSP {
display: block;
}
}
body.page-template-page-lp3 .vk-mobile-nav-menu-btn {
display: none;
} #telework_lp .popup {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/telework/bg_gray_dots_popup.png) repeat;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
z-index: 9999;
overflow-y: auto;
overflow-x: hidden;
padding: 80px 50px;
display: none;
}
@media screen and (max-width: 498px) {
#telework_lp .popup {
padding: 60px 35px;
}
}
#telework_lp .popup.active {
display: block;
}
#telework_lp .popup .slides {
max-width: 600px;
width: 90%;
margin: 0 auto;
}
#telework_lp .popup .slide {
display: none;
position: relative;
}
#telework_lp .popup .slide.active {
display: block;
}
#telework_lp .popup p {
margin-top: 1em;
line-height: 1.5;
}
#telework_lp .popup .btn-close {
position: absolute;
top: -20px;
right: -70px;
width: 50px;
height: 50px;
cursor: pointer;
}
@media screen and (max-width: 767px) {
#telework_lp .popup .btn-close {
right: -50px;
width: 35px;
height: 35px;
}
}
@media screen and (max-width: 498px) {
#telework_lp .popup .btn-close {
right: -35px;
width: 25px;
height: 25px;
}
}
#telework_lp .popup .btn-close:hover {
opacity: 0.7;
}
#telework_lp .popup .slide .img-wrapper {
position: relative;
}
#telework_lp .popup .indicator {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: nowrap;
width: calc(100% + 100px);
margin: 0 auto;
position: absolute;
left: -50px;
top: calc(50% - 17.5px);
}
@media screen and (max-width: 498px) {
#telework_lp .popup .indicator {
width: calc(100% + 70px);
left: -35px;
top: calc(50% - 15px);
}
}
#telework_lp .popup .indicator img {
width: 35px;
height: 35px;
cursor: pointer;
}
@media screen and (max-width: 498px) {
#telework_lp .popup .indicator img {
width: 30px;
height: 30px;
}
}
#telework_lp .popup .indicator img:hover {
opacity: 0.7;
} .page-template-page-seminar_list .siteContent {
padding: 3.5em 0 3.5em;
margin-top: 50px;
}
#seminar_list_page .seminar_list_mv {
margin-bottom: 30px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/seminar_list/seminar_list_mv.jpg) center no-repeat;
background-size: cover;
height: 300px;
width: 100%;
}
@media screen and (max-width: 767px) {
#seminar_list_page .seminar_list_mv {
height: 250px;
}
}
@media screen and (max-width: 498px) {
#seminar_list_page .seminar_list_mv {
height: 200px;
}
}
#seminar_list_page .seminar-list-switch {
text-align: center;
}
#seminar_list_page .seminar-list-switch a {
display: inline-block;
margin: 0 5px 30px;
max-width: 350px;
width: calc(50% - 20px);
padding: 1em 0.5em;
text-align: center;
text-decoration: none;
color: #000;
border: 2px solid #c00;
background: transparent;
position: relative;
font-size: 17px;
}
@media screen and (max-width: 767px) {
#seminar_list_page .seminar-list-switch a {
margin: 0 2% 30px;
width: 47%;
font-size: 14px;
}
#seminar_list_page .seminar-list-switch a:first-child {
margin-right: 1%;
}
#seminar_list_page .seminar-list-switch a:last-child {
margin-left: 1%;
}
}
#seminar_list_page .seminar-list-switch a.active {
color: #fff;
background: #c00;
}
#seminar_list_page .seminar-list-switch a.active:after {
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: #c00 transparent transparent transparent;
position: absolute;
bottom: -10px;
left: calc(50% - 10px);
}
#seminar_list_page .seminar_list_blank {
height: 300px;
}
#seminar_list_page .seminar_list_sp_br {
display: none;
}
@media screen and (max-width: 560px) {
#seminar_list_page .seminar_list_sp_br {
display: block;
}
} .post-name-thanks-dl_kintone .link {
margin: 1.5em 0 1.2em;
clear: both;
font-weight: 700;
font-size: 1.75rem;
line-height: 1.4;
text-decoration: underline;
} #downloadList .mainSection {
width: 100%;
}
#downloadList #document_dl section {
margin-bottom: 80px;
}
#downloadList #document_dl h1 {
font-size: 34px;
margin-bottom: 2em;
}
#downloadList #document_dl h2.sec-title {
font-size: 26px;
font-weight: bold;
position: relative;
line-height: 1.3;
padding-left: 0.8em;
}
#downloadList #document_dl h2.sec-title:before {
content: "";
display: block;
width: 5px;
height: 110%;
background: #c00;
position: absolute;
left: 0;
top: -5%;
}
#downloadList #document_dl li.dl_block.dummy {
border: none;
padding: 0;
margin: 0;
box-shadow: none;
background: transparent;
}
#downloadList #document_dl ul {
width: 100%;
justify-content: space-between;
}
#downloadList #document_dl li.dl_block {
width: 31%;
background: #fff;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
border: none;
opacity: 1;
min-width: inherit;
}
#downloadList #document_dl li.dl_block .title {
background-size: auto 80%;
background-color: #f0f0f0;
transition: all 0.3s ease;
height: 180px;
margin: 0;
}
#downloadList #document_dl li.dl_block:hover .title {
background-size: auto 90%;
}
#downloadList #document_dl li.dl_block h2 {
margin: 0 0 20px;
background-color: #333333;
color: #fff;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
#downloadList #document_dl a,
#downloadList .dl_details a {
opacity: 1;
text-decoration: none;
transition: all 0.3s ease-out;
box-sizing: border-box;
border: 2px #c00 solid;
font-weight: bold;
background: #c00;
line-height: 1.3;
padding: 0.3em 1em;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: nowrap;
height: 60px;
}
#downloadList #document_dl a:hover,
#downloadList .dl_details a:hover {
background: #fff;
color: #c00;
border: 2px #c00 solid;
border-radius: 30px;
}
#downloadList #document_dl .nav {
justify-content: center;
flex-wrap: wrap;
border-bottom: 4px solid #c00;
margin-bottom: 70px;
}
#downloadList #document_dl .nav li a {
width: 100%;
background: transparent;
color: #333333;
border: none;
font-size: 16px;
}
#downloadList #document_dl .nav li {
border-left: 2px dotted #c00;
border-top: 2px solid #c00;
width: 25%;
position: relative;
padding-bottom: 1em;
}
#downloadList #document_dl .nav li:hover {
background: #ffeeee;
}
#downloadList #document_dl .nav li:after {
content: "";
display: block;
position: absolute;
left: 50%;
bottom: 13px;
width: 7px;
height: 7px;
border-left: 2px solid #c00;
border-bottom: 2px solid #c00;
transform: rotate(-45deg);
transition: all 0.2s ease-out;
}
#downloadList #document_dl .nav li:hover:after {
bottom: 8px;
}
#downloadList #document_dl .nav li:last-child {
border-right: 2px dotted #f00;
}
#downloadList #document_dl .nav li br {
display: none;
}
#downloadList .dl_details .capture {
position: relative;
}
#downloadList .dl_details .close_btn2 {
color: #fff;
background: #000;
text-align: center;
width: 90%;
margin: 0 auto;
opacity: 1;
text-decoration: none;
transition: all 0.3s ease-out;
box-sizing: border-box;
border: 2px #000 solid;
font-weight: bold;
cursor: pointer;
line-height: 1.3;
padding: 0.3em 1em;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: nowrap;
height: 60px;
}
#downloadList .dl_details .close_btn2:hover {
background: #fff;
color: #000;
border: 2px #000 solid;
border-radius: 30px;
}
#downloadList .dl_details .close_btn2.pc {
position: absolute;
width: 200px;
left: calc(50% - 100px);
bottom: 0;
}
#downloadList .dl_details .close_btn2.sp {
display: none;
}
#downloadList .dl_details .capture .top {
margin-bottom: 20px;
}
#downloadList .dl_details p.message br {
display: none;
}
@media screen and (max-width: 992px) {
#downloadList #document_dl li.dl_block {
width: 48%;
}
#downloadList #document_dl .nav li a {
font-size: 14px;
}
#downloadList .dl_details .close_btn2.pc {
display: none;
}
#downloadList .dl_details .close_btn2.sp {
display: flex;
margin-top: 20px;
}
}
@media screen and (max-width: 767px) {
#downloadList section {
text-align: center;
}
#downloadList #document_dl h2.sec-title {
display: inline-block;
}
#downloadList #document_dl ul {
justify-content: center;
text-align: left;
}
#downloadList #document_dl li.dl_block {
width: 100%;
max-width: 350px;
}
#downloadList #document_dl .nav li {
width: 50%;
}
#downloadList #document_dl .nav li:nth-child(2n) {
border-right: 2px dotted #f00;
}
}
@media screen and (max-width: 415px) {
#downloadList #document_dl .nav li br {
display: block;
}
} #hy_case #block02.block02_2012 .block02_cat .tab-wrapper{
width: 100%;
}
@media screen and (max-width: 575px){
#hy_case #block02.block02_2012 .block02_cat .tab-wrapper{
width: 95%;
max-width: 350px;
margin: 0 auto;
}
}
#hy_case #block02.block02_2012 .block02_cat .tab{
display: flex;
justify-content: space-between;
flex-wrap: nowrap;
width: 100%;
margin-bottom: -15px;
}
#hy_case #block02.block02_2012 .block02_cat .tab_item{
display: flex;
width: calc(50% - 5px);
justify-content: center;
align-items: center;
border: none;
background: #fff;
padding: 1.5em 1em;
font-weight: bold;
font-size: 17px;
border-radius: 0;
outline: none;
}
@media screen and (max-width: 767px){
#hy_case #block02.block02_2012 .block02_cat .tab_item{
font-size: 12px;
}
}
#hy_case #block02.block02_2012 .block02_cat .tab_item.active{
box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
}
#hy_case #block02.block02_2012 .block02_cat .tab_item:hover{
opacity: 0.7;
}
#hy_case #block02.block02_2012 .block02_cat .cat-wrapper{
width: 100%;
z-index: 1;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
background: #fff;
position: relative;
margin: 15px 0 30px;
}
#hy_case #block02.block02_2012 .block02_cat .cat-wrapper:before{
content: "";
display: block;
width: calc(50% - 5px);
height: 15px;
background: #fff;
position: absolute;
top: -15px;
right: auto;
left: 0;
}
#hy_case #block02.block02_2012 .block02_cat .cat-wrapper.active:before{
right: 0;
left: auto;
}
#hy_case #block02.block02_2012 .block02_cat .cat-list{
display: none;
padding: 2em 2em;
text-align: center;
}
@media screen and (max-width: 575px){
#hy_case #block02.block02_2012 .block02_cat .cat-list{
padding: 2em 1em;
text-align: left;
}
}
#hy_case #block02.block02_2012 .block02_cat .cat-list.active{
display: block;
}
#hy_case #block02.block02_2012 .block02_cat .cat-list input[type="radio"]{
margin-right: 0.2em;
}
#hy_case #block02.block02_2012 .block02_cat .cat-list label{
display: inline-block;
margin: 0 0.5em 0.5em;
}
@media screen and (max-width: 767px){
#hy_case #block02.block02_2012 .block02_cat .cat-list label{
font-size: 12px;
}
}
#hy_case #block02.block02_2012 .block02_cat .cat-list label:hover{
opacity: 0.7;
}
#hy_case #block02.block02_2012 .block02_2 .case-list{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 100%;
}
@media screen and (max-width: 575px){
#hy_case #block02.block02_2012 .block02_2 .case-list{
width: 95%;
margin: 0 auto;
justify-content: center;
}
}
#hy_case #block02.block02_2012 .block02_2 .case-list li{
box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
width: 32%;
transition: all .5s ease;
margin-bottom: 30px;
position: relative;
}
@media screen and (max-width: 991px){
#hy_case #block02.block02_2012 .block02_2 .case-list li{
width: 49%;
}
}
@media screen and (max-width: 575px){
#hy_case #block02.block02_2012 .block02_2 .case-list li{
width: 100%;
max-width: 350px;
}
}
#hy_case #block02.block02_2012 .block02_2 .case-list li.dummy{
box-shadow: none;
padding: 0;
display: block!important;
}
#hy_case #block02.block02_2012 .block02_2 .case-list li:hover{
box-shadow: 0 0 16px rgba(0, 0, 0, 0.4);
}
#hy_case #block02.block02_2012 .block02_2 .case-list li.dummy:hover{
box-shadow: none;
}
#hy_case #block02.block02_2012 .block02_2 .case-list li .txtblock{
padding: 1em;
}
#hy_case #block02.block02_2012 .block02_2 .case-list li a{
color: #333333;
text-decoration: none;
}
#hy_case #block02.block02_2012 .block02_2 li a h3{
line-height: 1.3;
}
#hy_case #block02.block02_2012 .block02_2 li p.case_catchcopy{
line-height: 1.5;
margin-bottom: 1.5em;
}
@media screen and (max-width: 991px){
#hy_case #block02.block02_2012 .block02_2 li a .imgblock{
height: 175px;
}
}
#hy_case #block02.block02_2012 .block02_2 .case-list .case_tasks{
line-height: 1.5;
font-size: 13px;
}
#hy_case #block02.block02_2012 .block02_2 .case-list .case_tasks span{
display: inline-block;
line-height: 1.3;
padding: 0.3em 0.5em 0.2em;
margin: 0 0.5em 0.3em 0;
font-size: 12px;
background: #aaa;
color: #fff;
border-radius: 10px;
} #hy_case h1 + p {
text-align: center;
margin: 0 auto 50px;
padding: 0 20px;
font-size: 20px;
}
#hy_case h1 + p span {
font-size: 12px;
}
#hy_case #block02.block02_2012 .block02_2 .assistant-list li{
width: 23%;
border-radius: 12px;
}
@media screen and (max-width: 991px){
#hy_case #block02.block02_2012 .block02_2 .assistant-list li{
width: 49%;
}
}
@media screen and (max-width: 575px){
#hy_case #block02.block02_2012 .block02_2 .assistant-list li{
width: 100%;
max-width: 350px;
}
}
#hy_case #block02.block02_2012 .block02_2 .assistant-list li .imgblock {
border-radius: 12px 12px 0 0;
aspect-ratio: 1 / 1;
width: 100%;
height: auto;
}
#hy_case #block02.block02_2012 .block02_2 .assistant-list li .assistant_job {
display: inline-block;
margin-bottom: 5px;
padding: 6px 8px;
font-size: 10px;
line-height: 1;
background-color: #c00;
color: #fff;
border-radius: 4px;
}
#hy_case #block02.block02_2012 .block02_2 .assistant-list li .assistant_job.job_3,
#hy_case #block02.block02_2012 .block02_2 .assistant-list li .assistant_job.job_4 {
background-color: #036FA2;
}
#hy_case #block02.block02_2012 .block02_2 .assistant-list li .assistant_catchcopy {
font-size: 13px;
line-height: 1.5;
margin-bottom: 1.5em;
}
#hy_case #block02.block02_2012 .block02_2 .assistant-list li .assistant_tasks {
line-height: 1.5;
font-size: 13px;
}
#hy_case #block02.block02_2012 .block02_2 .assistant-list li .assistant_tasks span {
display: inline-block;
line-height: 1.3;
padding: 0.3em 0.5em 0.2em;
margin: 0 0.5em 0.3em 0;
font-size: 10px;
color: #6B6B6B;
border: 1px solid #6B6B6B;
border-radius: 4px;
} #onlineevent{
margin-top: 70px;
}
@media screen and (max-width: 991px) {
#onlineevent{
margin-top: 55px;
}
}
#onlineevent .container{
width: 95%;
max-width: 1000px;
margin: 0 auto;
padding: 0;
}
#onlineevent .sp{
display: none;
}
@media screen and (max-width: 767px) {
#onlineevent .sp{
display: block;
}
#onlineevent .pc{
display: none;
}
}
#onlineevent .txt-yellow{
color: #ffff00;
}
#onlineevent section{
padding: 50px 0;
position: relative;
}
@media screen and (max-width: 767px) {
#onlineevent section{
padding: 13.3vw 0;
}
}
#onlineevent .sec-ttl{
color: #0b3b57;
text-align: center;
font-size: 22px;
line-height: 1.8;
font-weight: bold;
}
@media screen and (max-width: 767px) {
#onlineevent .sec-ttl{
font-size: 5.3vw;
}
}
#onlineevent .sec-ttl .underline{
background: linear-gradient(transparent 60%, #ffff00 60%);
}
#onlineevent .mv{
background: url(//help-you.me/wp1/wp-content/themes/hy/img/onlineevent-support/mv-bg.jpg) center no-repeat;
background-size: cover;
padding: 90px 0;
text-align: center;
}
@media screen and (max-width: 767px) {
#onlineevent .mv{
background: url(//help-you.me/wp1/wp-content/themes/hy/img/onlineevent-support/mv-bg-sp.jpg) top center no-repeat;
background-size: cover;
padding: 11vw 0;
}
}
#onlineevent h1{
color: #fff;
font-size: 42px;
text-align: center;
text-shadow: 3px 3px 5px rgba(0,0,0,0.4);
font-weight: bold;
margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
#onlineevent h1{
font-size: 7.8vw;
}
}
#onlineevent h1 span{
font-size: inherit;
line-height: inherit;
margin-top: 0.4em;
display: block;
}
@media screen and (max-width: 767px) {
#onlineevent h1 span{
margin-top: 0;
}
}
#onlineevent h1 span:before{
display: none;
}
#onlineevent .mv p{
color: #fff;
font-weight: bold;
font-size: 17px;
text-align: center;
margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
#onlineevent .mv p{
font-size: 4.5vw;
margin-bottom: 2em;
}
}
#onlineevent .mv ul{
width: 550px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
}
@media screen and (max-width: 767px) {
#onlineevent .mv ul{
width: 66.6vw;
}
}
#onlineevent .mv li{
width: 24%;
text-align: center;
padding: 0.3em;
background: rgba(255,255,255,0.85);
border: 1px solid #096ea9;
color: #0b3b57;
font-size: 16px;
border-radius: 3px;
}
@media screen and (max-width: 767px) {
#onlineevent .mv li{
width: 47%;
font-size: 3.7vw;
border-radius: 0.4vw;
margin-bottom: 1em;
}
}
#onlineevent .mv .btn{
background: #c50000;
color: #fff;
font-size: 16px;
text-align: center;
width: 263px;
height: 65px;
border-radius: 32.5px;
display: flex;
justify-content: center;
align-items: center;
line-height: 1.2;
margin: 60px auto 0;
text-decoration: none;
}
@media screen and (max-width: 767px) {
#onlineevent .mv .btn{
font-size: 4vw;
width: 67.8vw;
height: 16.8vw;
border-radius: 8.4vw;
margin: 8vw auto 0;
}
}
#onlineevent #sec-worries{
background: #f2f2f2;
padding: 50px 0 30px;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-worries{
padding: 13.3vw 0 8vw;
}
}
#onlineevent #sec-worries:after{
content: "";
display: block;
position: absolute;
bottom: -24px;
left: calc(50% - 43px);
width: 0;
height: 0;
border-style: solid;
border-width: 24px 43px 0 43px;
border-color: #f2f2f2 transparent transparent transparent;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-worries:after{
bottom: -4vw;
left: calc(50% - 5.7vw);
border-width: 4vw 5.7vw 0 5.7vw;
}
}
#onlineevent .worries-list{
display: flex;
justify-content: space-around;
flex-wrap: wrap;
margin-top: 60px;
}
@media screen and (max-width: 767px) {
#onlineevent .worries-list{
margin-top: 13.3vw;
justify-content: center;
}
}
#onlineevent .worries-list li{
width: 210px;
text-align: center;
}
@media screen and (max-width: 767px) {
#onlineevent .worries-list li{
width: 57.3vw;
}
}
#onlineevent .worries-list li img{
width: 95%;
margin-bottom: 25px;
}
@media screen and (max-width: 767px) {
#onlineevent .worries-list li img{
margin-bottom: 6vw;
}
}
#onlineevent .worries-list li p{
text-align: center;
font-size: 16px;
color: #333333;
line-height: 1.5;
margin-bottom: 2.5em;
}
@media screen and (max-width: 767px) {
#onlineevent .worries-list li p{
font-size: 4.4vw;
}
}
#onlineevent #sec-support{
padding: 90px 0 120px;
}
#onlineevent .support-list{
margin-top: 50px;
}
#onlineevent .support-list .item{
display: flex;
align-items: flex-start;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
#onlineevent .support-list .item{
justify-content: center;
margin: 0 auto 16vw;
width: 80vw;
}
}
#onlineevent .support-list .item:last-child{
margin-bottom: 0;
}
#onlineevent .support-list .item .txt{
width: 49%;
}
@media screen and (max-width: 767px) {
#onlineevent .support-list .item .txt{
width: 100%;
}
}
#onlineevent .support-list .item .photo{
width: 46%;
margin-bottom: 5.3vw;
}
@media screen and (max-width: 767px) {
#onlineevent .support-list .item .photo{
width: 100%;
}
}
#onlineevent .support-list .item:nth-child(2n) .txt{
order: 2;
}
#onlineevent .support-list .item:nth-child(2n) .photo{
order: 1;
}
@media screen and (max-width: 767px) {
#onlineevent .support-list .item:nth-child(2n) .txt{
order: 1;
}
#onlineevent .support-list .item:nth-child(2n) .photo{
order: 2;
}
}
#onlineevent .support-list h3{
height: 117px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/onlineevent-support/diagonal-lines.png) left center no-repeat;
background-size: contain;
padding-left: 68px;
display: flex;
align-items: center;
justify-content: flex-start;
flex-wrap: nowrap;
font-size: 21px;
font-weight: bold;
color: #0b3b57;
line-height: 1.5;
margin-bottom: 30px;
}
@media screen and (max-width: 1000px) {
#onlineevent .support-list h3{
height: 11.7vw;
padding-left: 6.8vw;
font-size: 2.1vw;
margin-bottom: 3vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent .support-list h3{
height: 19.7vw;
padding-left: 11.3vw;
font-size: 4.4vw;
margin-bottom: 7.3vw;
}
}
#onlineevent .support-list .item .txt-bottom{
display: flex;
justify-content: flex-start;
align-items: center;
}
#onlineevent .support-list .item .txt-bottom.sp{
display: none;
}
@media screen and (max-width: 767px) {
#onlineevent .support-list .item .txt-bottom.pc{
display: none;
}
#onlineevent .support-list .item .txt-bottom.sp{
display: flex;
order: 3;
}
}
#onlineevent .support-list .item .txt-bottom img{
width: 37%;
margin-right: 1em;
}
@media screen and (max-width: 767px) {
#onlineevent .support-list .item .txt-bottom img{
width: 35%;
margin-right: 2vw;
}
}
#onlineevent .support-list .item .txt-bottom p{
font-size: 16px;
color: #333333;
}
@media screen and (max-width: 1000px) {
#onlineevent .support-list .item .txt-bottom p{
font-size: 1.6vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent .support-list .item .txt-bottom p{
font-size: 3.2vw;
}
}
#onlineevent #sec-service{
background: #e2f4f4;
padding: 50px 0 80px;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-service{
padding: 13.3vw 0 5.6vw;
}
}
#onlineevent .service-flow{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 50px;
}
@media screen and (max-width: 767px) {
#onlineevent .service-flow{
justify-content: center;
margin-top: 13.3vw;
}
}
#onlineevent .service-flow li{
width: calc((100% - 120px) / 4);
position: relative;
background: #fff;
box-shadow: 0 0 3px rgba(0,0,0,0.15);
text-align: center;
}
@media screen and (max-width: 1000px){
#onlineevent .service-flow li{
width: calc((100% - 12vw) / 4);
}
}
@media screen and (max-width: 767px) {
#onlineevent .service-flow li{
width: 58.6vw;
margin-bottom: 21vw;
}
}
#onlineevent .service-flow li:after{
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 23px 0 23px 18px;
border-color: transparent transparent transparent #5ac1d1;
position: absolute;
right: -30px;
top: 130px;
}
@media screen and (max-width: 1000px){
#onlineevent .service-flow li:after{
border-width: 2.3vw 0 2.3vw 1.8vw;
right: -3vw;
top: 13vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent .service-flow li:after{
border-width: 4vw 5.3vw 0 5.3vw;
border-color: #5ac1d1 transparent transparent transparent;
right: calc(50% - 5.3vw);
top: auto;
bottom: -12.6vw;
}
}
#onlineevent .service-flow li:last-child:after{
display: none;
}
#onlineevent .service-flow li img{
margin-bottom: 20px;
}
@media screen and (max-width: 1000px){
#onlineevent .service-flow li img{
margin-bottom: 2vw;
}
}
#onlineevent .service-flow li h4{
font-size: 20px;
color: #0b3b57;
font-weight: bold;
margin-bottom: 0.8em;
}
@media screen and (max-width: 1000px){
#onlineevent .service-flow li h4{
font-size: 2vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent .service-flow li h4{
font-size: 5.4vw;
}
}
#onlineevent .service-flow li p{
color: #333333;
font-size: 15px;
font-weight: bold;
line-height: 1.5;
}
@media screen and (max-width: 1000px){
#onlineevent .service-flow li p{
font-size: 1.5vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent .service-flow li p{
font-size: 4.1vw;
}
}
#onlineevent .service-flow li p .small{
font-weight: normal;
font-size: 14px;
display: inline-block;
line-height: 1.5;
margin-top: 0.2em;
}
@media screen and (max-width: 1000px){
#onlineevent .service-flow li p .small{
font-size: 1.4vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent .service-flow li p .small{
font-size: 3.6vw;
}
}
#onlineevent .cta{
text-align: center;
background: #69b4d6 url(//help-you.me/wp1/wp-content/themes/hy/img/onlineevent-support/cta-bg.png);
padding: 50px 0 35px;
background-size: 15px;
}
@media screen and (max-width: 767px) {
#onlineevent .cta{
padding: 15.6vw 0 20vw;
background-size: 15px;
}
}
#onlineevent .cta p{
font-weight: bold;
color: #fff;
font-size: 20px;
margin-bottom: 1.2em;
}
@media screen and (max-width: 767px) {
#onlineevent .cta p{
font-size: 5.3vw;
margin-bottom: 2em;
}
}
#onlineevent .cta .arrow{
display: block;
width: 30px;
margin: 0 auto 15px;
}
@media screen and (max-width: 767px) {
#onlineevent .cta .arrow{
width: 9.3vw;
margin: 0 auto 12vw;
}
}
#onlineevent .cta-btn{
width: 330px;
height: 82px;
background: #ffff00;
font-weight: bold;
color: #0b3b57;
font-size: 19px;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: nowrap;
border-radius: 41px;
box-shadow: 2px 2px 2px rgba(0,0,0,0.15);
margin: 0 auto;
text-decoration: none;
}
@media screen and (max-width: 767px) {
#onlineevent .cta-btn{
width: 72.8vw;
height: 18.1vw;
font-size: 4.4vw;
border-radius: 9.05vw;
}
}
#onlineevent #sec-delivery{
padding: 80px 0 130px;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-delivery{
padding: 22vw 0 14.6vw;
}
}
#onlineevent #sec-delivery:before{
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 180px 50vw 0 0;
border-color: #dff2fc transparent transparent transparent;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-delivery:before{
border-width: 24.8vw 91vw 0 0;
}
}
#onlineevent #sec-delivery:after{
content: "";
display: block;
position: absolute;
bottom: 0;
right: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 180px 50vw;
border-color: transparent transparent #dff2fc transparent;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-delivery:after{
border-width: 0 0 24.8vw 91vw;
}
}
#onlineevent .container{
position: relative;
z-index: 2;
}
#onlineevent .delivery-list{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
position: relative;
z-index: 2;
}
@media screen and (max-width: 767px) {
#onlineevent .delivery-list{
justify-content: center;
margin-top: 10vw;
}
}
#onlineevent .delivery-list li{
width: 32%;
position: relative;
text-align: center;
}
@media screen and (max-width: 767px) {
#onlineevent .delivery-list li{
width: 95%;
margin-bottom: 18vw;
}
}
#onlineevent .delivery-list li h3{
position: absolute;
width: 100%;
top: calc(50% - 0.5em);
color: #fff;
font-weight: bold;
font-size: 1.8vw;
text-shadow: 0 0 4px rgba(0,0,0,0.5);
}
@media screen and (max-width: 767px) {
#onlineevent .delivery-list li h3{
font-size: 4.4vw;
}
}
#onlineevent .delivery-list li h3 .adj{
letter-spacing: -0.3em;
}
#onlineevent #sec-case{
background: #bce1f5 url(//help-you.me/wp1/wp-content/themes/hy/img/onlineevent-support/case-bg.jpg) center no-repeat;
background-size: cover;
padding: 70px 0 50px;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case{
background: #bce1f5 url(//help-you.me/wp1/wp-content/themes/hy/img/onlineevent-support/case-bg-sp.jpg) center no-repeat;
padding: 17.3vw 0 18.4vw;
}
}
#onlineevent .case-list{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 50px;
}
@media screen and (max-width: 767px) {
#onlineevent .case-list{
justify-content: center;
margin-top: 9.3vw;
}
}
#onlineevent .case-list li{
background: #fff;
box-shadow: 0 0 3px rgba(0,0,0,0.15);
width: 31%;
text-align: center;
}
@media screen and (max-width: 767px) {
#onlineevent .case-list li{
width: 66.6vw;
margin-bottom: 10.4vw;
}
#onlineevent .case-list li:last-child{
margin-bottom: 0;
}
}
#onlineevent .case-list li .txt{
padding: 24px 1em 0;
}
@media screen and (max-width: 1000px) {
#onlineevent .case-list li .txt{
padding: 2.4vw 1em 0;
}
}
@media screen and (max-width: 767px) {
#onlineevent .case-list li .txt{
padding: 5.3vw 1em 0;
}
}
#onlineevent .case-list h3{
color: #0b3b57;
font-weight: bold;
font-size: 22px;
position: relative;
margin-bottom: 40px;
}
@media screen and (max-width: 1000px) {
#onlineevent .case-list h3{
font-size: 2.2vw;
margin-bottom: 4vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent .case-list h3{
font-size: 4.9vw;
margin-bottom: 8.6vw;
}
}
#onlineevent .case-list h3.small{
font-size: 16px;
}
@media screen and (max-width: 1000px) {
#onlineevent .case-list h3.small{
font-size: 1.6vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent .case-list h3.small{
font-size: 3.5vw;
}
}
#onlineevent .case-list h3:after{
content: "";
display: block;
width: 25px;
height: 4px;
background: #5ac2df;
position: absolute;
bottom: -20px;
left: calc(50% - 12.5px);
}
@media screen and (max-width: 1000px) {
#onlineevent .case-list h3:after{
width: 2.5vw;
height: 0.4vw;
bottom: -2vw;
left: calc(50% - 1.25vw);
}
}
@media screen and (max-width: 767px) {
#onlineevent .case-list h3:after{
width: 5.3vw;
height: 0.8vw;
bottom: -5vw;
left: calc(50% - 2.65vw);
}
}
#onlineevent .case-list p{
font-size: 14px;
}
@media screen and (max-width: 1000px) {
#onlineevent .case-list p{
font-size: 1.6vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent .case-list p{
font-size: 3.3vw;
}
}
#onlineevent #sec-case-details{
background: #e2f4f4;
padding: 60px 0;
position: relative;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details{
padding: 10.6vw 0;
}
}
#onlineevent #sec-case-details:after{
content: "";
display: block;
position: absolute;
bottom: -24px;
left: calc(50% - 43px);
width: 0;
height: 0;
border-style: solid;
border-width: 24px 43px 0 43px;
border-color: #e2f4f4 transparent transparent transparent;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details:after{
bottom: -4vw;
left: calc(50% - 5.7vw);
border-width: 4vw 5.7vw 0 5.7vw;
}
}
#onlineevent #sec-case-details .case-block{
background: #fff;
box-shadow: 0 0 3px rgba(0,0,0,0.15);
padding: 40px 4.5%;
position: relative;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .case-block{
padding: 12vw 4.5% 8vw;
}
}
#onlineevent #sec-case-details .tag{
position: absolute;
left: 90px;
top: -12px;
background: #fbb03b;
color: #fff;
text-align: center;
width: 122px;
height: 125px;
font-size: 16px;
text-align: center;
padding: 1.2em 0.5em 0;
font-weight: bold;
}
@media screen and (max-width: 1000px) {
#onlineevent #sec-case-details .tag{
left: 9vw;
top: -1.2vw;
width: 12.2vw;
height: 12.5vw;
font-size: 1.6vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .tag{
left: 4vw;
top: -2.5vw;
width: 22.6vw;
height: 24.8vw;
font-size: 3.4vw;
}
}
#onlineevent #sec-case-details .tag:before{
content: "";
display: block;
position: absolute;
top: 0;
right: -8px;
width: 0;
height: 0;
border-style: solid;
border-width: 12px 0 0 8px;
border-color: transparent transparent transparent #a57425;
}
@media screen and (max-width: 1000px) {
#onlineevent #sec-case-details .tag:before{
right: -0.8vw;
border-width: 1.2vw 0 0 0.8vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .tag:before{
right: -1.3vw;
border-width: 2.5vw 0 0 1.3vw;
}
}
#onlineevent #sec-case-details .tag:after{
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 0 61px 18px 61px;
border-color: transparent transparent #ffffff transparent;
position: absolute;
bottom: 0;
left: 0;
}
@media screen and (max-width: 1000px) {
#onlineevent #sec-case-details .tag:after{
border-width: 0 6.1vw 1.8vw 6.1vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .tag:after{
border-width: 0 11.3vw 3.7vw 11.3vw;
}
}
#onlineevent #sec-case-details .sec-sub-ttl{
color: #0b3b57;
font-size: 20px;
text-align: center;
font-weight: normal;
position: relative;
margin-bottom: 38px;
}
@media screen and (max-width: 1000px) {
#onlineevent #sec-case-details .sec-sub-ttl{
font-size: 2vw;
margin-bottom: 3.8vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .sec-sub-ttl{
font-size: 4.4vw;
margin-bottom: 10.6vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .sec-ttl{
font-size: 4.9vw;
margin-bottom: 1em;
}
}
#onlineevent #sec-case-details .sec-sub-ttl:after{
content: "";
display: block;
width: 28px;
height: 4px;
background: #5ac2df;
bottom: -20px;
left: calc(50% - 14px);
}
@media screen and (max-width: 1000px) {
#onlineevent #sec-case-details .sec-sub-ttl:after{
width: 2.8vw;
height: 0.4vw;
bottom: -2vw;
left: calc(50% - 1.4vw);
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .sec-sub-ttl:after{
width: 4.8vw;
height: 0.6vw;
bottom: -3.2vw;
left: calc(50% - 2.4vw);
}
}
#onlineevent #sec-case-details .contents{
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
margin-bottom: 45px;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .contents{
margin-bottom: 14.6vw;
justify-content: center;
}
}
#onlineevent #sec-case-details .contents img{
width: 45%;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .contents img{
width: 76vw;
margin-bottom: 10.6vw;
}
}
#onlineevent #sec-case-details .contents .txt{
width: 50%;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .contents .txt{
width: 50%;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .contents .txt{
width: 76vw;
}
}
#onlineevent #sec-case-details .contents .txt p{
font-size: 16px;
color: #333333;
line-height: 1.8;
margin: 0;
}
@media screen and (max-width: 1000px) {
#onlineevent #sec-case-details .contents .txt p{
font-size: 1.7vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .contents .txt p{
font-size: 3.7vw;
}
}
#onlineevent #sec-case-details .contents hr{
border-top: 1px solid #333333;
}
#onlineevent #sec-case-details .voice{
max-width: 785px;
width: 100%;
border: 2px solid #f08f98;
border-radius: 5px;
padding: 40px 20px 20px 40px;
display: flex;
align-items: center;
justify-content: space-between;
margin: 0 auto;
}
@media screen and (max-width: 1000px) {
#onlineevent #sec-case-details .voice{
padding: 4vw 2vw 2vw 4vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .voice{
max-width: inherit;
width: 84.2vw;
padding: 7.3vw 2.6vw;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
}
#onlineevent #sec-case-details .voice img{
width: 25%;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .voice img{
width: 60%;
margin: 0 auto 6.6vw;
}
}
#onlineevent #sec-case-details .voice .txt{
width: 70%;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .voice .txt{
width: 100%;
}
}
#onlineevent #sec-case-details .voice h4{
color: #0b3b57;
font-size: 21px;
padding-left: 1em;
border-left: 4px solid #5ac2df;
margin: 0 0 0.9em 4px;
}
@media screen and (max-width: 1000px) {
#onlineevent #sec-case-details .voice h4{
font-size: 2.1vw;
margin: 0 0 0.9em 0.4vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .voice h4{
font-size: 4.4vw;
margin: 0 0 0.9em 1em;
border-left: 1vw solid #5ac2df;
}
}
#onlineevent #sec-case-details .voice li{
text-indent: -1em;
padding-left: 1em;
font-size: 15px;
line-height: 1.5;
margin-bottom: 0.4em;
}
@media screen and (max-width: 1000px) {
#onlineevent #sec-case-details .voice li{
font-size: 1.6vw;
}
}
@media screen and (max-width: 767px) {
#onlineevent #sec-case-details .voice li{
font-size: 3.8vw;
}
}
#onlineevent #sec-contact table{
max-width: 560px;
width: 95%;
margin: 0 auto;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact table{
max-width: initial;
}
}
#onlineevent #sec-contact th{
border: none;
vertical-align: top;
font-size: 16px;
font-weight: normal;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact th{
font-size: 3.5vw;
padding-left: 0;
padding-right: 0;
width: 27vw;
}
}
#onlineevent #sec-contact th span.required{
font-size: 13px;
color: #ed1e79;
display: inline-block;
margin-left: 0.4em;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact th span.required{
font-size: 2.6vw;
}
#onlineevent #sec-contact th span.required.adj{
display: block;
text-align: right;
margin-top: -0.3em;
}
}
#onlineevent #sec-contact th label{
margin-top: 1em;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact th label{
margin-top: 0.2em;
}
} #onlineevent #sec-contact td{
border: none;
vertical-align: top;
padding-left: 0;
padding-right: 0;
}
#onlineevent #sec-contact span.wpcf7-list-item{
display: block;
font-size: 17px;
margin-left: 10px;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact span.wpcf7-list-item{
font-size: 3.8vw;
margin-left: 2.6vw;
}
}
#onlineevent #sec-contact .privacy{
max-width: 560px;
width: 95%;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact .privacy{
max-width: initial;
}
}
#onlineevent #sec-contact .form-control{
border: 1px solid #000;
border-radius: 7px;
font-size: 15px;
width: 100%;
max-width: inherit;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact .form-control{
font-size: 2.6vw;
}
}
#onlineevent #sec-contact input.form-control{
height: 58px;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact input.form-control{
height: 9.6vw;
}
}
#onlineevent #sec-contact .form-control::placeholder{
font-size: 15px;
color: #999999;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact .form-control::placeholder{
font-size: 2.6vw;
}
}
#onlineevent #sec-contact .btn-primary{
display: flex;
margin: 0 auto;
background: #ff801e url(//help-you.me/wp1/wp-content/themes/hy/img/onlineevent-support/arrow-r.png) no-repeat;
background-position: bottom 43px right 30px;
background-size: 46px 10px;
color: #fff;
width: 410px;
height: 85px;
justify-content: center;
align-items: center;
flex-wrap: nowrap;
font-size: 19px;
font-weight: bold;
border-radius: 42.5px;
box-shadow: 1px 1px 2px rgba(0,0,0,0.15);
border: none;
transition: .3s ease all;
position: relative;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact .btn-primary{
width: 80.5vw;
height: 16.8vw;
font-size: 4vw;
border-radius: 8.4vw;
background-position: bottom 8.5vw right 7vw;
background-size: 9vw 2vw;
}
}
#onlineevent #sec-contact .btn-primary:hover{
background-position: bottom 43px right 20px;
opacity: 0.8;
}
@media screen and (max-width: 767px) {
#onlineevent #sec-contact .btn-primary:hover{
background-position: bottom 8.5vw right 5vw;
}
}
#onlineevent .down-to-top{
opacity: 0.1;
transform: translateY(20px);
transition: all .5s;
}
#onlineevent .down-to-top.scrollin {
opacity: 1;
transform: translateY(0);
}
#onlineevent ul.gMenu > li:last-child > a{
border: none;
margin: 0 13px;
padding: 10px 2px;
color: #595757;
}
#onlineevent ul.gMenu > li:last-child > a:hover{
color: inherit;
background: rgba(0,0,0,.03);
}
#onlineevent .company{
margin: 0;
width: 100%;
padding: 70px 0;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/onlineevent-support/company.jpg) left center no-repeat;
background-size: cover;
position: relative;
}
#onlineevent .company:before{
content: "";
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.35);
}
#onlineevent .company .company_inner{
margin: 0 auto;
width: calc(100vw - 20rem);
max-width: 1500px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
position: relative;
}
#onlineevent .company h2{
text-indent: -9999px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/onlineevent-support/company_info_w.svg) left center no-repeat;
background-size: auto 30px;
width: 100%;
height: 3rem;
font-weight: bold;
margin-bottom: 50px;
}
#onlineevent .company .com_info,
#onlineevent .company .access{
width: calc(50% - 3rem);
padding: 0;
display: flex;
flex-wrap: wrap;
align-content: space-between;
color: #fff;
}
#onlineevent .company dl{
width: 100%;
margin: 0;
}
#onlineevent .company dt{
border: none;
padding: 0;
line-height: 2em;
}
#onlineevent .company dd{
border: none;
padding: 0;
margin-bottom: 1em;
line-height: 2em;
}
#onlineevent .company iframe{
width: 100%;
}
#onlineevent .company .com_info dl{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#onlineevent .company .com_info dt{
width: 6em;
}
#onlineevent .company .com_info dd{
width: calc(100% - 8em);
}
#onlineevent .company .privacy_mark img{
width: 100px;
}
#onlineevent .alert-info{
display: none!important;
}
#onlineevent .mobile-nav-menu-btn {
position: fixed;
top: 5px;
left: 5px;
z-index: 2100;
overflow: hidden;
border: 1px solid #333;
border-radius: 2px;
width: 34px;
height: 34px;
cursor: pointer;
text-indent: -9999px;
background-size: 24px 24px;
-webkit-transition: border-color .5s ease-out;
transition: border-color .5s ease-out;
border-color: #333;
background: url(//help-you.me/wp1/wp-content/themes/lightning/inc/vk-mobile-nav/package/images/vk-menu-btn-black.svg) center 50% no-repeat rgba(255,255,255,.8);
left: auto;
right: 5px;
display: none;
}
#onlineevent .mobile-nav-menu-btn.menu-open {
border-color: #fff;
background: url(//help-you.me/wp1/wp-content/themes/lightning/inc/vk-mobile-nav/package/images/vk-menu-close-white.svg) center 50% no-repeat;
border: 1px solid rgba(255,255,255,.8);
}
#onlineevent .mobile-nav {
position: fixed;
top: -2000px;
z-index: 2000;
width: 100%;
height: auto;
display: block;
padding: 45px 10px;
overflow: none;
-webkit-transition: top .5s ease-out;
transition: top .5s ease-out;
background-color: #c00;
border-bottom: none;
}
#onlineevent .mobile-nav.mobile-nav-open{
top: 0;
}
#onlineevent .mobile-nav nav ul li a{
padding: .7em .5em;
position: relative;
display: block;
overflow: hidden;
color: #fff;
border-bottom: none;
}
#onlineevent .siteHeader .container{ padding: 0 0 2px;
}
@media screen and (min-width: 992px) {
#onlineevent .navbar-brand img {
max-height: 70px;
}
}
@media screen and (max-width: 991px) {
#onlineevent .company{
padding: 60px 0;
}
#onlineevent .company .company_inner{
width: 100%;
}
#onlineevent .company .com_info,
#onlineevent .company .access{
width: 100%;
}
#onlineevent .siteHeader .container{
padding: 0;
}
#onlineevent .navbar-header{
height: 55px;
}
#onlineevent .mobile-nav-menu-btn{
display: block;
}
}
@media screen and (max-width: 767px) {
#onlineevent .company{
padding: 10vw 0;
}
#onlineevent .company .company_inner{
width: 100%;
}
#onlineevent .company h2{
background-size: contain;
background-position: center;
width: 100%;
height: 5vw;
}
#onlineevent .company .access{
margin: 0;
}
#onlineevent .company dl{
margin: 0 auto;
font-size: 3.5vw;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 85vw;
}
#onlineevent .company .com_info dt,
#onlineevent .company dt{
width: 5em;
}
#onlineevent .company .com_info dd,
#onlineevent .company .access dd{
width: calc(100% - 6.5em);
}
#onlineevent .company .access dd:last-child{
width: 100%;
}
#onlineevent .company .wp-block-columns{
display: block;
}
} #onlineevent.thanks h1{
color: #cc0000;
font-size: 32px;
text-align: center;
line-height: 1.3em;
margin-bottom: 1em;
font-weight: bold;
text-shadow: none;
}
#onlineevent.thanks main{
padding-top: 70px;
}
@media screen and (max-width: 767px) {
#onlineevent.thanks h1{
font-size: 24px;
}
#onlineevent.thanks main{
padding-top: 50px;
}
} #downloadList.renew210310 #document_dl h1{
color: #333333;
}
#downloadList.renew210310 #document_dl #sec-pickup{
margin-bottom: 40px;
padding-bottom: 40px;
border-bottom: 1px solid #aaa;
}
#downloadList.renew210310 #document_dl #sec-pickup h2{
text-align: center;
font-size: 36px;
font-weight: bold;
margin-bottom: 0.5em;
}
#downloadList.renew210310 #document_dl #sec-pickup h3{
text-align: center;
font-size: 28px;
font-weight: bold;
margin-bottom: 1.5em;
}
#downloadList.renew210310 #document_dl #sec-pickup .pickup-contents{
display: flex;
justify-content: center;
flex-wrap: wrap;
padding: 30px 0;
}
#downloadList.renew210310 #document_dl #sec-pickup .pickup-contents .image{
width: 50%;
text-align: center;
}
#downloadList.renew210310 #document_dl #sec-pickup .pickup-contents .image img{
width: 70%;
height: auto;
border: 1px solid #aaa;
}
#downloadList.renew210310 #document_dl #sec-pickup .pickup-contents .text{
width: 50%;
padding: 0 5%;
}
#downloadList.renew210310 #document_dl #sec-pickup h4{
font-weight: bold;
font-size: 21px;
}
#downloadList.renew210310 #document_dl #sec-pickup h5{
font-weight: bold;
font-size: 17.5px;
}
#downloadList.renew210310 #document_dl #sec-pickup a{
max-width: 300px;
}
#downloadList.renew210310 #document_dl h3.sec-subtitle{
display: inline-block;
background: rgb(253,236,236);
font-weight: bold;
padding: 0.5em 1em;
margin: 1em 0 1.5em;
font-size: 24px;
letter-spacing: 0.1em;
line-height: 1.7;
}
#downloadList.renew210310 #document_dl li.dl_block{
box-shadow: none;
width: 30%;
}
#downloadList.renew210310 #document_dl li.dl_block h2{
background: transparent;
color: #333333;
padding: 0;
box-shadow: none;
margin-bottom: 0.5em;
}
#downloadList.renew210310 #document_dl li.dl_block .title{
margin-bottom: 1em;
}
#downloadList.renew210310 #document_dl a{
width: 100%;
}
@media screen and (max-width: 992px){
#downloadList.renew210310 #document_dl li.dl_block{
width: 48%;
}
}
@media screen and (max-width: 767px){
#downloadList.renew210310 #document_dl h2.sec-title{
font-size: 20px;
text-align: left;
}
#downloadList.renew210310 #document_dl h3.sec-subtitle{
font-size: 18px;
}
#downloadList.renew210310 #document_dl #sec-pickup h2{
font-size: 24px;
}
#downloadList.renew210310 #document_dl #sec-pickup h3{
font-size: 20px;
}
#downloadList.renew210310 #document_dl #sec-pickup .pickup-contents .image{
width: 100%;
max-width: 500px;
margin: 0 auto 50px;
}
#downloadList.renew210310 #document_dl #sec-pickup .pickup-contents .text{
width: 100%;
}
#downloadList.renew210310 #document_dl #sec-pickup h4{
font-size: 18px;
}
#downloadList.renew210310 #document_dl #sec-pickup h5{
font-size: 15px;
}
#downloadList.renew210310 #document_dl li.dl_block{
width: 100%;
max-width: 350px;
}
} #marketing-support {
background: #fff;
color: #000;
}
#marketing-support .container {
width: 95%;
max-width: 920px;
height: 100%;
margin: 0 auto;
position: relative;
z-index: 3;
padding: 0;
}
#marketing-support .sp {
display: none !important;
}
@media screen and (max-width: 767px) {
#marketing-support .sp {
display: block !important;
}
}
@media screen and (max-width: 767px) {
#marketing-support .pc {
display: none !important;
}
}
#marketing-support .nowrap {
display: inline-block;
}
#marketing-support .btn-contact {
width: 284px;
height: 66px;
border-radius: 33px;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
background: #FEDC3D;
font-size: 30px;
font-weight: bold;
text-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
margin: 0 auto;
text-decoration: none;
transition: .3s all ease;
border: 3px solid #FEDC3D;
}
#marketing-support .btn-contact:hover {
opacity: 1;
color: #FEDC3D;
background: #fff;
transform: scale(1.1);
}
@media screen and (max-width: 1090px) {
#marketing-support .btn-contact {
width: 29.3vw;
height: 6.8vw;
border-radius: 3.4vw;
font-size: 3.1vw;
text-shadow: 0 0.4vw 0.4vw rgba(0, 0, 0, 0.1);
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.25);
}
}
@media screen and (max-width: 767px) {
#marketing-support .btn-contact {
width: 42.1vw;
height: 10.7vw;
border-radius: 5.35vw;
font-size: 4.8vw;
text-shadow: 0 1.1vw 1.1vw rgba(0, 0, 0, 0.1);
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.25);
}
}
@media screen and (max-width: 480px) {
#marketing-support .btn-contact {
width: 50vw;
height: 13vw;
font-size: 5.5vw;
border-radius: 6.5vw;
}
}
#marketing-support header {
height: 78px;
background: #2673B8;
position: relative;
z-index: 10;
}
#marketing-support header.bg_lightblue{
background: #DBF3FF;
}
#marketing-support header .container {
max-width: 1045px;
display: flex;
align-items: center;
justify-content: flex-start;
}
#marketing-support header .h-logo img {
width: 150px;
}
#marketing-support header .h-logo.plus img {
width: 240px;
}
#marketing-support .mv {
position: relative;
background: #fff;
}
#marketing-support .mv .container {
max-width: 1090px;
position: relative;
padding: 90px 0 0 0;
z-index: 3;
}
#marketing-support .mv:after {
content: "";
display: block; width: 125.6%; height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #fff;
bottom: -140px;
}
@media screen and (max-width: 1280px) {
#marketing-support .mv:after {
height: 54.7vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support .mv:after {
height: 45.3vw;
}
}
@media screen and (max-width: 480px) {
#marketing-support header .h-logo.plus img {
width: 50vw;
}
}
#marketing-support .mv .mv_img {
position: absolute;
right: 0;
top: 90px;
width: 550px;
z-index: 0;
}
#marketing-support .mv .txt {
position: relative;
width: 560px;
z-index: 1; }
#marketing-support .mv h2 {
background: #2673B8;
color: #fff;
font-size: 27px;
padding: 0.5em;
margin-bottom: 60px;
line-height: 1.3;
font-weight: bold;
display: inline-block;
}
#marketing-support .mv h1 {
color: #2673B8;
font-size: 39px;
font-weight: bold;
line-height: 1.3;
margin-bottom: 60px;
display: inline-block;
text-align: left;
}
#marketing-support .mv .btn-contact {
width: 239px;
height: 61px;
font-size: 26px;
}
@media screen and (max-width: 1090px) {
#marketing-support .mv .container {
padding: 8.3vw 0 0 0;
}
#marketing-support .mv:after {
bottom: -12.8vw;
}
#marketing-support .mv .mv_img {
top: 8.3vw;
width: 50.5vw;
}
#marketing-support .mv .txt {
width: 54vw;  }
#marketing-support .mv h2 {
font-size: 2.5vw;
margin-bottom: 5.5vw;
}
#marketing-support .mv h1 {
font-size: 3.5vw;
margin-bottom: 5.5vw;
}
#marketing-support .mv .btn-contact {
width: 21.9vw;
height: 5.6vw;
font-size: 2.4vw;
margin-top: 8.0vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support .mv .container {
padding: 14.7vw 0 0 0;
}
#marketing-support .mv .mv_img {
position: relative;
right: auto;
top: auto;
width: 100%;
}
#marketing-support .mv .txt {
width: 82.4vw;
margin: 0 auto;
text-align: center;
}
#marketing-support .mv h2 {
font-size: 4.8vw;
margin-bottom: 12.0vw;
}
#marketing-support .mv h1 {
font-size: 5.9vw;
margin-bottom: 5.7vw;
display: inline-block;
}
#marketing-support .mv .btn-contact {
width: 42.1vw;
height: 10.7vw;
font-size: 4.8vw;
}
}
@media screen and (max-width: 480px) {
#marketing-support .mv h1 {
font-size: 6.5vw;
}
#marketing-support .mv .btn-contact {
width: 50vw;
height: 13vw;
font-size: 5.5vw;
border-radius: 6.5vw;
}
}
#marketing-support section {
position: relative;
padding: 85px 0 0;
}
#marketing-support .sec-ttl {
text-align: center;
position: relative;
font-size: 30px;
margin: 0 0 3.5em;
}
#marketing-support .sec-ttl h2 {
font-size: inherit;
font-weight: bold;
line-height: 1.3;
margin-bottom: 0;
}
#marketing-support .sec-ttl p {
font-size: 20px;
line-height: 1.5;
margin-bottom: 0;
}
#marketing-support .sec-ttl:after {
content: "";
display: block;
width: 80px;
height: 6px;
background: #FEDC3D;
position: absolute;
bottom: -1.3em;
left: calc(50% - 40px);
}
@media screen and (max-width: 985px) {
#marketing-support .sec-ttl {
font-size: 3.1vw;
}
#marketing-support .sec-ttl p {
font-size: 2.1vw;
}
#marketing-support .sec-ttl:after {
width: 8.3vw;
height: 0.6vw;
left: calc(50% - 4.1vw);
}
}
@media screen and (max-width: 767px) {
#marketing-support .sec-ttl {
font-size: 4.8vw;
}
#marketing-support .sec-ttl p {
font-size: 3.2vw;
}
#marketing-support .sec-ttl:after {
width: 13.3vw;
height: 1.6vw;
left: calc(50% - 6.67vw);
}
}
@media screen and (max-width: 480px) {
#marketing-support .sec-ttl {
font-size: 5.5vw;
}
#marketing-support .sec-ttl p {
font-size: 4vw;
}
}
#marketing-support #sec-service {
background: #DBF3FF; padding-top: 270px;
}
#marketing-support #sec-service:after {
content: "";
display: block; width: 125.6%; height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #DBF3FF;
bottom: -160px;
}
@media screen and (max-width: 1280px) {
#marketing-support #sec-service:after {
height: 54.7vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-service:after {
height: 45.3vw;
}
}
#marketing-support #sec-service .service-list {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#marketing-support #sec-service .service-list li {
width: 30%;
display: flex;
flex-wrap: wrap;
}
#marketing-support #sec-service .service-list li .photo {
position: relative;
width: 100%;
}
#marketing-support #sec-service .service-list li img {
width: 100%;
height: auto;
}
#marketing-support #sec-service .service-list li h3 {
position: absolute;
line-height: 1.3;
width: 100%;
text-align: center;
color: #fff;
font-size: 28px;
font-weight: normal;
top: calc(50% - 18.2px);
}
#marketing-support #sec-service .service-list li p {
width: 100%;
background: #fff;
font-size: 16px;
line-height: 1.3;
padding: 1.8em 1.8em 1.5em;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.1);
margin: 1.3em 0 0;
min-height: 11em;
}
@media screen and (max-width: 985px) {
#marketing-support #sec-service { padding-top: 27.9vw;
}
#marketing-support #sec-service:after {
bottom: -16.5vw;
}
#marketing-support #sec-service .service-list li h3 {
font-size: 2.9vw;
top: calc(50% - 1.9vw);
}
#marketing-support #sec-service .service-list li p {
font-size: 1.7vw;
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.1);
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-service {
margin-top: 0;
padding-top: 26.1vw;
}
#marketing-support #sec-service:after {
bottom: -16.5vw;
}
#marketing-support #sec-service .service-list {
width: 73.3vw;
margin: 0 auto;
justify-content: center;
}
#marketing-support #sec-service .service-list li {
width: 100%;
margin-bottom: 13.3vw;
}
#marketing-support #sec-service .service-list li img {
width: 60vw;
display: block;
margin: 0 auto;
}
#marketing-support #sec-service .service-list li h3 {
font-size: 6vw;
top: calc(50% - 3vw);
}
#marketing-support #sec-service .service-list li p {
font-size: 3.2vw;
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.1);
min-height: inherit;
margin-top: 2em;
padding: 2.5em;
}
}
@media screen and (max-width: 480px) {
#marketing-support #sec-service .service-list li p {
font-size: 4vw;
}
}
#marketing-support #sec-problem {
padding: 240px 0 260px;
background: #fff;
}
#marketing-support #sec-problem .img-problem {
width: 657px;
display: inline-block;
margin-left: 60px;
}
#marketing-support #sec-problem .problem-list li {
height: 158px;
display: flex;
flex-wrap: wrap;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
margin-bottom: 10px;
}
#marketing-support #sec-problem .problem-list li:last-child {
margin-bottom: 0;
}
#marketing-support #sec-problem .problem-list li h3 {
width: 323px;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
font-size: 26px;
font-weight: bold;
background: #626262;
padding: 0 1.5em;
text-align: center;
line-height: 1.2;
}
#marketing-support #sec-problem .problem-list li .right {
width: calc(100% - 323px);
display: flex;
justify-content: flex-start;
align-items: center;
background: #FEDC3D;
position: relative;
}
#marketing-support #sec-problem .problem-list li .right p {
font-size: 15.5px;
line-height: 1.3;
margin: 0 115px 0 4em;
}
#marketing-support #sec-problem .problem-list li .right .icon-light {
width: 115px;
position: absolute;
top: 10px;
right: 0;
}
@media screen and (max-width: 985px) {
#marketing-support #sec-problem {
padding: 24.8vw 0 26.9vw;
}
#marketing-support #sec-problem .img-problem {
width: 67.9vw;
margin-left: 6.2vw;
}
#marketing-support #sec-problem .problem-list li {
height: 16.3vw;
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.25);
margin-bottom: 1.0vw;
}
#marketing-support #sec-problem .problem-list li h3 {
width: 33.4vw;
font-size: 2.7vw;
}
#marketing-support #sec-problem .problem-list li .right {
width: calc(100% - 33.4vw);
}
#marketing-support #sec-problem .problem-list li .right p {
font-size: 1.6vw;
margin: 0 11.9vw 0 4em;
}
#marketing-support #sec-problem .problem-list li .right .icon-light {
width: 11.9vw;
top: 1.0vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-problem {
padding: 30vw 0 30vw;
}
#marketing-support #sec-problem .img-problem {
width: 100%;
margin-left: auto;
}
#marketing-support #sec-problem .problem-list li {
height: 18.1vw;
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.25);
margin-bottom: 1.1vw;
}
#marketing-support #sec-problem .problem-list li h3 {
width: 32.3vw;
font-size: 3.7vw;
padding: 0;
}
#marketing-support #sec-problem .problem-list li .right {
width: calc(100% - 32.3vw);
}
#marketing-support #sec-problem .problem-list li .right p {
font-size: 2.6vw;
margin: 0 5.0vw 0 1.2em;
}
#marketing-support #sec-problem .problem-list li .right .icon-light {
width: 8.0vw;
top: 0.5vw;
}
}
@media screen and (max-width: 480px) {
#marketing-support #sec-problem .problem-list li h3 {
width: 32.3vw;
font-size: 3.8vw;
padding: 0;
}
#marketing-support #sec-problem .problem-list li .right p {
font-size: 3vw;
margin: 0 5.0vw 0 1.2em;
}
}
#marketing-support #sec-feature {
padding: 0 0 50px;
background: #D7D7D7;
}
#marketing-support #sec-feature:before {
content: "";
display: block;
width: 125.6%;
height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #D7D7D7;
top: -160px;
}
@media screen and (max-width: 1280px) {
#marketing-support #sec-feature:before {
height: 54.7vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-feature:before {
height: 45.3vw;
}
}
#marketing-support #sec-feature:after {
content: "";
display: block; width: 125.6%; height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #D7D7D7;
bottom: -160px;
z-index: 3;
}
@media screen and (max-width: 1280px) {
#marketing-support #sec-feature:after {
height: 54.7vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-feature:after {
height: 45.3vw;
}
}
#marketing-support #sec-feature .sec-ttl {
position: relative;
top: -50px;
}
#marketing-support #sec-feature .feature-list {
position: relative;
z-index: 4;
}
#marketing-support #sec-feature .feature-list li {
background: #2673B8; width: calc(460.5px + 50%);
margin: 0 0 150px auto;
padding: 55px 0 55px 290px;
position: relative;
}
#marketing-support #sec-feature .feature-list li .txt {
color: #fff;
}
#marketing-support #sec-feature .feature-list li .number {
position: absolute;
width: 250px;
left: -30px;
bottom: -30px;
}
#marketing-support #sec-feature .feature-list li h3 {
font-size: 28px;
font-weight: bold;
text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
line-height: 1.3;
margin-bottom: 1.2em;
}
#marketing-support #sec-feature .feature-list li h4 {
font-size: 25px;
font-weight: bold;
line-height: 1.3;
margin-bottom: 0.6em;
}
#marketing-support #sec-feature .feature-list li p {
font-size: 16px;
margin: 0;
line-height: 1.3;
max-width: 720px;
color: #fff;
}
#marketing-support #sec-feature .feature-list li:before {
content: "";
display: block;
width: 100%;
height: 3px;
background: #fff;
position: absolute;
top: 66px;
right: calc(100% - 211px);
}
#marketing-support #sec-feature .feature-list li:nth-child(2n) {
margin: 0 auto 150px 0;
padding: 50px 290px 50px 0;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n) .txt {
text-align: right;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n) .number {
left: auto;
right: -30px;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n):before {
right: auto;
left: calc(100% - 211px);
}
#marketing-support #sec-feature .feature-list li:nth-child(2n) p {
margin-left: auto;
margin-right: 0;
}
#marketing-support #sec-feature .feature-list li:last-child {
margin-bottom: 0;
}
@media screen and (max-width: 985px) {
#marketing-support #sec-feature {
padding: 0 0 7vw;
}
#marketing-support #sec-feature:before {
top: -16.5vw;
}
#marketing-support #sec-feature:after {
bottom: -16.5vw;
}
#marketing-support #sec-feature .sec-ttl {
top: -5.2vw;
}
#marketing-support #sec-feature .feature-list li {
width: calc(45vw + 50%);
margin: 0 0 15.5vw auto;
padding: 5.7vw 0 5.7vw 30.0vw;
}
#marketing-support #sec-feature .feature-list li .number {
width: 25.8vw;
left: -3.1vw;
bottom: -3.1vw;
}
#marketing-support #sec-feature .feature-list li h3 {
font-size: 2.9vw;
text-shadow: 0 0.4vw 0.4vw rgba(0, 0, 0, 0.25);
}
#marketing-support #sec-feature .feature-list li h4 {
font-size: 2.6vw;
}
#marketing-support #sec-feature .feature-list li p {
font-size: 1.7vw;
max-width: 74.4vw;
}
#marketing-support #sec-feature .feature-list li:before {
height: 0.3vw;
top: 6.8vw;
right: calc(100% - 21.8vw);
}
#marketing-support #sec-feature .feature-list li:nth-child(2n) {
margin: 0 auto 15.5vw 0;
padding: 5.2vw 30.0vw 5.2vw 0;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n) .number {
right: -3.1vw;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n):before {
left: calc(100% - 21.8vw);
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-feature {
padding: 0 0 15.5vw;
}
#marketing-support #sec-feature .sec-ttl {
top: 0;
}
#marketing-support #sec-feature .feature-list li {
width: 86.4vw;
margin: 0 0 13.3vw auto;
padding: 8.0vw 8.0vw 6.7vw 26.7vw;
}
#marketing-support #sec-feature .feature-list li .number {
width: 26.7vw;
left: -3.1vw;
bottom: -3.1vw;
}
#marketing-support #sec-feature .feature-list li h3 {
font-size: 3.7vw;
text-shadow: 0 1.1vw 1.1vw rgba(0, 0, 0, 0.25);
}
#marketing-support #sec-feature .feature-list li h4 {
font-size: 3.2vw;
}
#marketing-support #sec-feature .feature-list li p {
font-size: 2.7vw;
max-width: inherit;
width: 100%;
}
#marketing-support #sec-feature .feature-list li p .nowrap {
display: inline;
}
#marketing-support #sec-feature .feature-list li:before {
height: 0.8vw;
top: 10vw;
right: 64.5vw;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n) {
margin: 0 auto 13.3vw 0;
padding: 8.0vw 26.7vw 6.7vw 8.0vw;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n) .number {
right: -3.1vw;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n):before {
left: 64.5vw;
}
}
@media screen and (max-width: 480px) {
#marketing-support #sec-feature {
padding: 0 0 15.5vw;
}
#marketing-support #sec-feature .sec-ttl {
top: 0;
}
#marketing-support #sec-feature .feature-list li {
padding: 8.0vw 5.0vw 6.7vw 22vw;
}
#marketing-support #sec-feature .feature-list li .number {
width: 24vw;
}
#marketing-support #sec-feature .feature-list li h3 {
font-size: 4vw;
}
#marketing-support #sec-feature .feature-list li h4 {
font-size: 3.5vw;
}
#marketing-support #sec-feature .feature-list li p {
font-size: 3.2vw;
}
#marketing-support #sec-feature .feature-list li:before {
right: 69.5vw;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n) {
padding: 8.0vw 22vw 6.7vw 5.0vw;
}
#marketing-support #sec-feature .feature-list li:nth-child(2n):before {
left: 69.5vw;
}
}
#marketing-support .cta {
position: relative;
}
#marketing-support .cta01 {
background: #2673B8;
padding: 320px 0 0;
margin: -160px 0 0;
}
#marketing-support .cta01:after {
content: "";
display: block;
width: 125.6%;
height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #2673B8;
bottom: -160px;
}
#marketing-support .cta01 .btn-contact{
position: relative;
top: 75px;
}
@media screen and (max-width: 1280px) {
#marketing-support .cta01:after {
height: 54.7vw;
}
}
@media screen and (max-width: 985px) {
#marketing-support .cta01 {
padding: 33.1vw 0 0;
margin: -16vw 0 0;
}
#marketing-support .cta01:after {
bottom: -16.5vw;
}
#marketing-support .cta01 .btn-contact{
top: 7vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support .cta01:after {
height: 45.3vw;
}
}
#marketing-support .cta02 {
background: #fff;
padding: 220px 0;
}
@media screen and (max-width: 985px) {
#marketing-support .cta02 {
padding: 22vw 0;
}
}
#marketing-support #sec-plan {
background: #DBF3FF;
padding: 270px 0 40px;
}
#marketing-support #sec-plan:after {
content: "";
display: block;
width: 125.6%;
height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #DBF3FF;
bottom: -160px;
}
@media screen and (max-width: 1280px) {
#marketing-support #sec-plan:after {
height: 54.7vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-plan:after {
height: 45.3vw;
}
}
#marketing-support #sec-plan h3 {
background: #2673B8;
color: #fff;
text-align: center;
font-size: 32px;
font-weight: bold;
line-height: 1.3;
padding: 0.3em 0;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
margin: 0;
}
#marketing-support #sec-plan .plan {
background: #fff;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
margin: 0 0 120px;
padding: 25px 30px 35px;
display: flex;
justify-content: center;
flex-wrap: wrap;
}
#marketing-support #sec-plan .plan:last-child {
margin-bottom: 0;
}
#marketing-support #sec-plan .plan-item {
border-right: 3px solid #E4E4E4;
text-align: center;
vertical-align: top;
width: calc(100% / 3);
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
}
#marketing-support #sec-plan .plan-item:last-child {
border-right: none;
}
@media screen and (min-width: 768px) {
#marketing-support #sec-plan h3.col2{
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
#marketing-support #sec-plan .plan.col2{
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
#marketing-support #sec-plan .plan.col2 .plan-item{
width: 50%;
}
}
#marketing-support #sec-plan h4 {
color: #2673B8;
font-weight: bold;
font-size: 32px;
line-height: 1.3;
margin: 1em 0;
}
#marketing-support #sec-plan h5 {
background: #2673B8;
text-align: center;
font-size: 16px;
display: inline-flex;
justify-content: center;
align-items: center;
line-height: 1.3; width: 173px;
height: 24px;
border-radius: 12px;
margin: 0 0 2em;
color: #fff;
}
#marketing-support #sec-plan ul {
text-align: left;
display: inline-block; width: 220px;
font-size: 16px;
margin-bottom: 2em;
}
#marketing-support #sec-plan ul li {
line-height: 1.3;
text-indent: -1em;
padding-left: 1em;
position: relative;
}
#marketing-support #sec-plan ul li:before {
content: "・";
}
#marketing-support #sec-plan ul li .icon {
width: 16px;
height: auto;
display: inline-block;
margin: -3px 0 0 10px;
cursor: pointer;
}
#marketing-support #sec-plan ul li .icon:hover {
opacity: 0.7;
}
#marketing-support #sec-plan ul li .balloon {
display: none;
position: absolute;
color: #fff;
font-size: 12px;
background: #292A2B;
border-radius: 15px;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
padding: 1em;
left: 37px;
bottom: 3.5em;
text-indent: 0;
}
#marketing-support #sec-plan ul li .balloon p {
line-height: 1.3;
}
#marketing-support #sec-plan ul li .balloon p:last-child {
margin-bottom: 0;
}
#marketing-support #sec-plan ul li .balloon:after {
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 18px 9px 0 9px;
border-color: #292A2B transparent transparent transparent;
position: absolute;
bottom: -18px;
left: 72px;
}
#marketing-support #sec-plan ul li .balloon.large {
width: 230px;
left: -5px;
}
#marketing-support #sec-plan ul li .balloon.large:after {
left: 173px;
}
#marketing-support #sec-plan ul li.active .balloon, #marketing-support #sec-plan ul li:hover .balloon {
display: block;
}
#marketing-support #sec-plan .price {
width: 230px;
border-top: 3px solid #e4e4e4;
color: #ea0000;
font-size: 36px;
font-weight: bold;
padding: 1em 0 0;
line-height: 1;
}
#marketing-support #sec-plan .price .price-wrapper {
display: inline-block;
}
#marketing-support #sec-plan .price .number {
width: 100%;
display: block;
}
#marketing-support #sec-plan .price .number .unit{
font-size: 20px;
}
#marketing-support #sec-plan .price .tax {
text-align: right;
font-size: 14px;
line-height: 1.3;
width: 100%;
display: block;
right: -1em;
position: relative;
}
@media screen and (max-width: 985px) {
#marketing-support #sec-plan {
padding: 27.9vw 0 4vw;
}
#marketing-support #sec-plan:after {
bottom: -16.5vw;
}
#marketing-support #sec-plan h3 {
font-size: 3.3vw;
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.25);
}
#marketing-support #sec-plan .plan {
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.25);
margin: 0 0 12.4vw;
padding: 2.6vw 3.1vw 3.6vw;
}
#marketing-support #sec-plan .plan-item {
border-right: 0.3vw solid #E4E4E4;
}
#marketing-support #sec-plan h4 {
font-size: 3.3vw;
}
#marketing-support #sec-plan h5 {
font-size: 1.7vw;
width: 17.9vw;
height: 2.5vw;
border-radius: 1.2vw;
}
#marketing-support #sec-plan ul { width: 22.5vw;
font-size: 1.65vw;
}
#marketing-support #sec-plan ul li .icon {
width: 1.7vw;
margin: -0.3vw 0 0 1.0vw;
}
#marketing-support #sec-plan ul li .balloon {
font-size: 1.2vw;
border-radius: 1.5vw;
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.25);
left: 3.8vw;
}
#marketing-support #sec-plan ul li .balloon:after {
border-width: 1.9vw 0.9vw 0 0.9vw;
bottom: -1.9vw;
left: 7.4vw;
}
#marketing-support #sec-plan ul li .balloon.large {
width: 23.8vw;
left: -0.5vw;
}
#marketing-support #sec-plan ul li .balloon.large:after {
left: 17.9vw;
}
#marketing-support #sec-plan .price {
width: 23.8vw;
border-top: 0.3vw solid #e4e4e4;
font-size: 3.7vw;
}
#marketing-support #sec-plan .price .number .unit{
font-size: 2vw;
}
#marketing-support #sec-plan .price .tax {
font-size: 1.4vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-plan {
padding: 27.9vw 0 12.4vw;
}
#marketing-support #sec-plan .container {
width: 80%;
}
#marketing-support #sec-plan:after {
bottom: -16.5vw;
}
#marketing-support #sec-plan h3 {
font-size: 5vw;
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.25);
}
#marketing-support #sec-plan .plan {
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.25);
margin: 0 0 12.4vw;
padding: 2.6vw 3.1vw 3.6vw;
}
#marketing-support #sec-plan .plan-item {
border-right: none;
border-bottom: 0.4vw solid #E4E4E4;
width: 100%;
padding-bottom: 5vw;
margin-bottom: 5vw;
}
#marketing-support #sec-plan .plan-item:last-child {
border-bottom: none;
}
#marketing-support #sec-plan h4 {
font-size: 5vw;
}
#marketing-support #sec-plan h5 {
font-size: 3vw;
width: 30vw;
height: 5vw;
border-radius: 2.5vw;
}
#marketing-support #sec-plan ul { width: 43vw;
margin-left: 10vw;
margin-right: 10vw;
font-size: 3.2vw;
text-align: left;
display: inline-block;
}
#marketing-support #sec-plan ul li .icon {
width: 3.2vw;
margin: -0.4vw 0 0 1.2vw;
}
#marketing-support #sec-plan ul li .balloon {
font-size: 2.7vw;
border-radius: 2.5vw;
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.25);
left: 5em;
bottom: 2.5em;
width: 12em;
}
#marketing-support #sec-plan ul li .balloon:after {
border-width: 3vw 1.5vw 0 1.5vw;
bottom: -3vw;
left: 10vw;
}
#marketing-support #sec-plan ul li .balloon.large {
width: 20.5em;
left: -1em;
}
#marketing-support #sec-plan ul li .balloon.large:after {
left: 13em;
}
#marketing-support #sec-plan .price {
width: 40vw;
margin-left: 10vw;
margin-right: 10vw;
border-top: 0.6vw solid #e4e4e4;
font-size: 7vw;
}
#marketing-support #sec-plan .price .number .unit{
font-size: 4vw;
}
#marketing-support #sec-plan .price .tax {
font-size: 3vw;
}
}
@media screen and (max-width: 480px) {
#marketing-support #sec-plan h3 {
font-size: 6vw;
}
#marketing-support #sec-plan .plan-item {
border-bottom: 0.8vw solid #E4E4E4;
}
#marketing-support #sec-plan h4 {
font-size: 6vw;
}
#marketing-support #sec-plan h5 {
font-size: 4.5vw;
width: 40vw;
height: 7vw;
border-radius: 3.5vw;
}
#marketing-support #sec-plan ul { width: 55vw;
font-size: 4vw;
}
#marketing-support #sec-plan ul li .icon {
width: 4vw;
margin: -0.4vw 0 0 1.5vw;
}
#marketing-support #sec-plan ul li .balloon {
font-size: 3.5vw;
}
#marketing-support #sec-plan .price {
width: 50vw;
border-top: 1vw solid #e4e4e4;
font-size: 9vw;
}
#marketing-support #sec-plan .price .tax {
font-size: 4vw;
}
}
#marketing-support #sec-flow {
padding: 0 0 50px;
background: #D7D7D7;
text-align: center;
margin-bottom: 200px;
}
#marketing-support #sec-flow .container {
z-index: 4;
max-width: 1051px;
}
#marketing-support #sec-flow:before {
content: "";
display: block; width: 125.6%; height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #D7D7D7;
top: -160px;
}
@media screen and (max-width: 1280px) {
#marketing-support #sec-flow:before {
height: 54.7vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-flow:before {
height: 45.3vw;
}
}
#marketing-support #sec-flow:after {
content: "";
display: block; width: 125.6%; height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #D7D7D7;
bottom: -160px;
z-index: 3;
}
@media screen and (max-width: 1280px) {
#marketing-support #sec-flow:after {
height: 54.7vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-flow:after {
height: 45.3vw;
}
}
#marketing-support #sec-flow .lead {
font-size: 27px;
line-height: 1.3;
display: inline-block;
text-align-last: left;
margin-bottom: 80px;
}
#marketing-support #sec-flow .flow-list {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
}
#marketing-support #sec-flow .flow-list li {
width: 317px;
height: 317px;
background: #fff;
display: flex;
align-items: flex-start;
justify-content: center;
border-radius: 158.5px;
padding-top: 45px;
position: relative;
}
#marketing-support #sec-flow .flow-list li .contents {
text-align: center;
width: 200px;
}
#marketing-support #sec-flow .flow-list li .icon {
width: 64px;
height: 64px;
}
#marketing-support #sec-flow .flow-list li .step {
color: #FEDC3D;
font-size: 18px;
font-weight: bold;
margin: 0.5em 0 1em;
line-height: 1.3;
}
#marketing-support #sec-flow .flow-list li h3 {
font-weight: bold;
font-size: 24px;
line-height: 1.3;
}
#marketing-support #sec-flow .flow-list li .description {
margin: 0.2em 0 0;
font-size: 16px;
line-height: 1.3;
text-align: left;
}
#marketing-support #sec-flow .flow-list li:after {
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 18px 0 18px 34px;
border-color: transparent transparent transparent #FEDC3D;
position: absolute;
right: -43px;
top: calc(50% - 18px);
}
#marketing-support #sec-flow .flow-list li:last-child:after {
display: none;
}
@media screen and (max-width: 1090px) {
#marketing-support #sec-flow .container {
width: 98%;
}
#marketing-support #sec-flow .flow-list li {
width: 29vw;
height: 29vw;
border-radius: 14.5vw;
padding-top: 3vw;
}
#marketing-support #sec-flow .flow-list li .contents {
width: 20.7vw;
}
#marketing-support #sec-flow .flow-list li .icon {
width: 6.6vw;
height: 6.6vw;
}
#marketing-support #sec-flow .flow-list li .step {
font-size: 1.9vw;
margin: 0.5em 0 0.3em;
}
#marketing-support #sec-flow .flow-list li h3 {
font-size: 2.3vw;
}
#marketing-support #sec-flow .flow-list li .description {
font-size: 1.5vw;
}
#marketing-support #sec-flow .flow-list li:after {
border-color: transparent transparent transparent #FEDC3D;
border-width: 1.9vw 0 1.9vw 3.4vw;
right: -4.3vw;
top: calc(50% - 1.9vw);
}
}
@media screen and (max-width: 985px) {
#marketing-support #sec-flow {
padding: 0 0 5.2vw;
margin-bottom: 20.7vw;
}
#marketing-support #sec-flow:before {
top: -16.5vw;
}
#marketing-support #sec-flow:after {
bottom: -16.5vw;
}
#marketing-support #sec-flow .lead {
font-size: 2.8vw;
margin-bottom: 8.3vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-flow {
padding: 0 0 5.2vw;
margin-bottom: 20.7vw;
}
#marketing-support #sec-flow .container {
width: 95%;
}
#marketing-support #sec-flow .lead {
font-size: 3.2vw;
margin-bottom: 8.0vw;
}
#marketing-support #sec-flow .flow-list {
justify-content: center;
flex-wrap: wrap;
}
#marketing-support #sec-flow .flow-list li {
width: 75.5vw;
height: 75.5vw;
border-radius: 37.75vw;
padding-top: 12.5vw;
margin-bottom: 14.4vw;
}
#marketing-support #sec-flow .flow-list li:last-child {
margin-bottom: 0;
}
#marketing-support #sec-flow .flow-list li .contents {
width: 40.0vw;
}
#marketing-support #sec-flow .flow-list li .icon {
width: 15.2vw;
height: 15.2vw;
}
#marketing-support #sec-flow .flow-list li .step {
font-size: 4.8vw;
}
#marketing-support #sec-flow .flow-list li h3 {
font-size: 4.3vw;
}
#marketing-support #sec-flow .flow-list li .description {
margin: 0.8em 0 0;
font-size: 3.2vw;
}
#marketing-support #sec-flow .flow-list li:after {
border-color: #FEDC3D transparent transparent transparent;
right: calc(50% - 5vw);
top: auto;
bottom: -12vw;
border-width: 9vw 5vw 0 5vw;
}
}
@media screen and (max-width: 480px) {
#marketing-support #sec-flow .lead {
font-size: 4vw;
}
#marketing-support #sec-flow .lead br {
display: none;
}
#marketing-support #sec-flow .flow-list li {
padding-top: 9vw;
}
#marketing-support #sec-flow .flow-list li .contents {
width: 46.0vw;
}
#marketing-support #sec-flow .flow-list li .step {
font-size: 5vw;
}
#marketing-support #sec-flow .flow-list li h3 {
font-size: 4.5vw;
}
#marketing-support #sec-flow .flow-list li .description {
font-size: 4vw;
}
}
#marketing-support #sec-faq {
background: #fff;
padding: 50px 0 260px;
}
#marketing-support #sec-faq .faq-list li {
border-radius: 55px;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
margin-bottom: 80px;
overflow: hidden;
}
#marketing-support #sec-faq .faq-list li:last-child {
margin-bottom: 0;
}
#marketing-support #sec-faq .faq-list li h3 {
color: #fff;
background: #2673B8;
font-weight: bold;
font-size: 27px;
text-align: center;
padding: 0.7em 0.5em;
line-height: 1.2;
}
#marketing-support #sec-faq .faq-list li h3 .txt {
position: relative;
display: inline-block;
padding: 0 0 0 70px;
max-width: 785px;
text-align: left;
}
#marketing-support #sec-faq .faq-list li h3 .txt:before {
content: "";
display: inline-block;
width: 50px;
height: 50px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/marketing_support/icon_question.png) center no-repeat;
background-size: contain;
position: absolute;
left: 0;
top: calc(50% - 25px);
}
#marketing-support #sec-faq .faq-list li .answer {
font-size: 18px;
padding: 2em 0;
background: #fff;
}
#marketing-support #sec-faq .faq-list li .answer p {
font-size: inherit;
line-height: 1.3;
margin: 0 auto;
max-width: 600px;
}
@media screen and (max-width: 985px) {
#marketing-support #sec-faq {
padding: 5.2vw 0 26.9vw;
}
#marketing-support #sec-faq .faq-list li {
border-radius: 5.7vw;
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.25);
margin-bottom: 8.3vw;
}
#marketing-support #sec-faq .faq-list li h3 {
font-size: 2.8vw;
}
#marketing-support #sec-faq .faq-list li h3 .txt {
padding: 0 0 0 7.2vw;
max-width: 81.1vw;
}
#marketing-support #sec-faq .faq-list li h3 .txt:before {
width: 5.2vw;
height: 5.2vw;
top: calc(50% - 2.6vw);
}
#marketing-support #sec-faq .faq-list li .answer {
font-size: 1.9vw;
}
#marketing-support #sec-faq .faq-list li .answer p {
max-width: 62.0vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-faq .faq-list li {
border-radius: 6.7vw;
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.25);
margin-bottom: 10.7vw;
}
#marketing-support #sec-faq .faq-list li h3 {
font-size: 4.3vw;
}
#marketing-support #sec-faq .faq-list li h3 .txt {
padding: 0 0 0 8.0vw;
max-width: inherit;
}
#marketing-support #sec-faq .faq-list li h3 .txt:before {
width: 6.4vw;
height: 6.4vw;
top: calc(50% - 3.2vw);
}
#marketing-support #sec-faq .faq-list li .answer {
font-size: 3.2vw;
padding: 1.5em 1em;
}
#marketing-support #sec-faq .faq-list li .answer p {
max-width: inherit;
}
}
@media screen and (max-width: 480px) {
#marketing-support #sec-faq .faq-list li .answer {
font-size: 4vw;
}
}
#marketing-support #sec-contact {
background: #DBF3FF;
padding: 0 0 100px;
}
#marketing-support #sec-contact:before {
content: "";
display: block; width: 125.6%; height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #DBF3FF;
top: -160px;
}
#marketing-support #sec-contact.bg-white:before{
background: transparent;
}
@media screen and (max-width: 1280px) {
#marketing-support #sec-contact {
padding: 0 0 12vw;
}
#marketing-support #sec-contact:before {
height: 54.7vw;
}
}
@media screen and (max-width: 985px) {
#marketing-support #sec-contact:before {
top: -16.5vw;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-contact:before {
height: 45.3vw;
}
}
#marketing-support footer {
background: #2673B8;
z-index: 4;
position: relative;
padding: 100px 0 80px;
text-align: center;
}
#marketing-support footer.bg_lightblue{
background: #DBF3FF;
}
#marketing-support footer .f-logo {
width: 300px;
display: inline-block;
margin-bottom: 80px;
}
#marketing-support footer .f-logo.plus{
width: 400px;
}
#marketing-support footer .copyright {
color: #fff;
font-size: 20px;
}
#marketing-support footer.bg_lightblue .copyright {
color: #777;
}
@media screen and (max-width: 767px) {
#marketing-support footer {
padding: 10.3vw 0 8.3vw;
text-align: center;
}
#marketing-support footer .f-logo {
width: 31.0vw;
margin-bottom: 8.3vw;
}
#marketing-support footer .f-logo.plus{
width: 45vw;
}
#marketing-support footer .copyright {
font-size: 2.1vw;
}
}
@media screen and (max-width: 480px) {
#marketing-support footer .f-logo {
width: 38vw;
}
#marketing-support footer .f-logo.plus{
width: 50vw;
}
#marketing-support footer .copyright {
font-size: 2.8vw;
}
}
#marketing-support .app-btn {
display: inline-block;
margin: 0 auto;
padding: 1.5em 1em;
position: relative;
width: 340px;
font-size: 20px;
text-decoration: none;
border-radius: 0;
border: 2px solid #2673B8;
background: transparent;
color: #2673B8;
background: #fff;
transition: 0.3s all ease;
}
#marketing-support .app-btn-wrapper:hover .app-btn {
background: #2673B8;
color: #fff;
transform: scale(1.1);
}
@media screen and (max-width: 480px) {
#marketing-support .app-btn {
width: 100%;
}
}
#marketing-support .app-btn:after,
#marketing-support #sec-contact .app-btn-wrapper:after {
content: "";
display: block;
width: 21px;
height: 60px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/marketing_support/r_arrow_blue.png) center no-repeat;
background-size: contain;
position: absolute;
right: 17px;
top: 17px;
transition: 0.3s all ease;
}
#marketing-support #sec-contact .app-btn-wrapper:hover:after {
background: url(//help-you.me/wp1/wp-content/themes/hy/img/marketing_support/r_arrow_white.png) center no-repeat;
background-size: contain;
transform: scale(1.1);
}
#marketing-support #sec-contact .seminar-form-item {
display: flex;
flex-wrap: nowrap;
margin-bottom: 22px;
position: relative;
}
@media screen and (max-width: 480px) {
#marketing-support #sec-contact .seminar-form-item {
flex-wrap: wrap;
}
}
#marketing-support #sec-contact .seminar-form-item br {
display: none;
}
#marketing-support #sec-contact .seminar-form-item label,
#marketing-support #sec-contact th {
background: #2673B8;
width: 40%;
padding: 0.8em 2.5%;
font-size: 17px;
letter-spacing: 0.1em;
margin: 0;
font-weight: bold;
color: #fff;
}
@media screen and (max-width: 480px) {
#marketing-support #sec-contact .seminar-form-item label,
#marketing-support #sec-contact th {
width: 100%;
}
}
@media screen and (max-width: 767px) {
#marketing-support #sec-contact .seminar-form-item label,
#marketing-support #sec-contact th {
font-size: 15px;
letter-spacing: 0;
}
}
#marketing-support #sec-contact th {
vertical-align: top;
}
#marketing-support #sec-contact .seminar-form-item label .small,
#marketing-support #sec-contact th .small {
font-size: 14px;
font-weight: normal;
}
@media screen and (max-width: 767px) {
#marketing-support #sec-contact .seminar-form-item label .small,
#marketing-support #sec-contact th .small {
font-size: 13px;
}
}
#marketing-support #sec-contact .seminar-form-item .wpcf7-form-control-wrap {
width: 60%;
}
@media screen and (max-width: 480px) {
#marketing-support #sec-contact .seminar-form-item .wpcf7-form-control-wrap {
width: 100%;
}
}
#marketing-support #sec-contact .seminar-form-item input,
#marketing-support #sec-contact .seminar-form-item textarea,
#marketing-support #sec-contact .seminar-form-item select,
#marketing-support #sec-contact td {
border: 1px solid #2673B8;
border-radius: 0;
height: 100%;
box-shadow: none;
background: #fff;
}
@media screen and (max-width: 480px) {
#marketing-support #sec-contact .seminar-form-item input,
#marketing-support #sec-contact .seminar-form-item textarea,
#marketing-support #sec-contact .seminar-form-item select,
#marketing-support #sec-contact td {
padding: 0.8em;
}
}
#marketing-support #sec-contact td p {
margin-bottom: 0;
}
#marketing-support #sec-contact span.wpcf7-list-item {
display: block;
margin: 0;
line-height: 1.5;
}
@media screen and (max-width: 480px) {
#marketing-support #sec-contact span.wpcf7-list-item {
margin: 0;
}
}
#marketing-support .wpcf7 .privacy dl {
background: #fff;
border: 1px solid #2673B8;
}
#marketing-support #sec-contact .app-btn-outer {
margin: 100px 0 50px;
}
#marketing-support #sec-contact .app-btn-wrapper {
display: inline-block;
position: relative;
max-width: 340px;
width: 100%;
}
#marketing-support #sec-plan h4.small{
font-size: 26px;
}
#marketing-support #sec-plan h4 .quantity{
font-size: 19px;
display: inline-block;
line-height: 1.3;
}
#marketing-support #sec-plan .plan-seo ul,
#marketing-support #sec-plan .plan-sns ul,
#marketing-support #sec-plan .plan-ad ul{
width: 240px;
}
#marketing-support #sec-plan .plan-item ul.notes li{
font-size: 15px;
margin-bottom: 0.5em;
}
#marketing-support #sec-plan .plan-item ul.notes li:last-child{
margin-bottom: 0;
}
#marketing-support #sec-plan .plan-item ul.notes li:before{
content: "※";
}
#marketing-support #sec-plan .plan-item .description{
width: 240px;
margin: 0 auto 2em;
font-size: 16px;
text-align: left;
line-height: 1.5;
}
@media screen and (max-width: 985px){
#marketing-support #sec-plan h4.small{
font-size: 2.95vw;
}
#marketing-support #sec-plan h4 .quantity{
font-size: 2.5vw;
}
#marketing-support #sec-plan .plan-seo ul,
#marketing-support #sec-plan .plan-sns ul,
#marketing-support #sec-plan .plan-ad ul{
width: 25vw;
}
#marketing-support #sec-plan .plan-item .description{
width: 25vw;
font-size: 1.65vw;
}
#marketing-support #sec-plan .plan-item ul.notes li{
font-size: 1.55vw;
}
}
@media screen and (max-width: 767px){
#marketing-support #sec-plan h4.small{
font-size: 5vw;
}
#marketing-support #sec-plan h4 .quantity{
font-size: 4vw;
}
#marketing-support #sec-plan .plan-seo ul,
#marketing-support #sec-plan .plan-sns ul,
#marketing-support #sec-plan .plan-ad ul{
width: 52vw;
}
#marketing-support #sec-plan .plan-item .description{
width: 52vw;
font-size: 3.2vw;
}
#marketing-support #sec-plan .plan-item ul.notes li{
font-size: 3vw;
}
}
@media screen and (max-width: 480px){
#marketing-support #sec-plan h4.small{
font-size: 6vw;
}
#marketing-support #sec-plan h4 .quantity{
font-size: 4.8vw;
}
#marketing-support #sec-plan .plan-seo ul,
#marketing-support #sec-plan .plan-sns ul,
#marketing-support #sec-plan .plan-ad ul{
width: 60vw;
}
#marketing-support #sec-plan .plan-item .description{
width: 60vw;
font-size: 4vw;
}
#marketing-support #sec-plan .plan-item ul.notes li{
font-size: 3.7vw;
}
}
#marketing-support .feature-flow{
z-index: 4;
margin-top: 150px;
max-width: 1090px;
-webkit-appearance: none;
-webkit-text-size-adjust: 100%;
}
#marketing-support .feature-flow-item-wrapper{
display: flex;
align-items: flex-start;
justify-content: space-between;
flex-wrap: wrap;
}
#marketing-support .feature-flow-item{
width: calc((100% - 35px) / 6);
}
#marketing-support .feature-flow-item h3{
background: #2673B8;
color: #fff;
font-weight: bold; font-size: 20px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
height: 6em;
padding: 0.6em;
line-height: 1.3;
margin-bottom: 0.8em;
position: relative;
}
#marketing-support .feature-flow-item:first-child h3{
background: #FEDC3D;
color: #EA0000;
}
#marketing-support .feature-flow-item h3:after{
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 3em 0 3em 1.2em;
border-color: transparent transparent transparent #2674b8;
position: absolute;
top: 0;
right: -1.185em;
z-index: 3;
}
#marketing-support .feature-flow-item h3:before{
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 3em 0 3em 1.2em;
border-color: transparent transparent transparent #D7D7D7;
position: absolute;
top: 0;
left: 0;
z-index: 2;
}
#marketing-support .feature-flow-item:first-child h3:after{
border-color: transparent transparent transparent #FEDC3D;
}
#marketing-support .feature-flow-item:first-child h3:before{
display: none;
}
#marketing-support .feature-flow-item h3 .txt{
position: relative;
left: 15px;
z-index: 5;
}
#marketing-support .feature-flow-item:first-child h3 .txt{
left: 0;
}
#marketing-support .feature-flow-item ul{
padding: 0.8em 0.5em 0.8em 0.3em;
background: #fff;
min-height: 8em;
box-shadow: 0 4px 4px 0 rgba(0,0,0,0.1); font-size: 15px;
}
#marketing-support .feature-flow-item li{
line-height: 1.3;
margin-bottom: 0.3em;
text-indent: -1em;
padding-left: 1em;
}
#marketing-support .feature-flow-item li:last-child{
margin-bottom: 0;
}
#marketing-support .feature-flow-item li:before{
content: "・";
}
@media screen and (max-width: 1100px){
#marketing-support .feature-flow{
margin-top: 15vw;
}
#marketing-support .feature-flow-item{
width: calc((100% - 3.5vw) / 6);
}
#marketing-support .feature-flow-item h3{
font-size: 1.8vw;
}
_::-webkit-full-page-media, _:future, :root #marketing-support .feature-flow-item h3:after {
right: -1.14em;
}
#marketing-support .feature-flow-item h3 .txt{
left: 1.5vw;
}
#marketing-support .feature-flow-item ul{
box-shadow: 0 0.4vw 0.4vw 0 rgba(0,0,0,0.1);
font-size: 1.35vw;
}
}
@media screen and (max-width: 767px){
#marketing-support .feature-flow{
margin-top: 13.3vw;
}
#marketing-support .feature-flow-item-wrapper{
padding-right: 1.5vw;
}
#marketing-support .feature-flow-item{
width: calc((100% - 3vw) / 3);
margin-bottom: 4vw;
}
#marketing-support .feature-flow-item h3{
font-size: 3.1vw;
}
#marketing-support .feature-flow-item h3 .txt{
left: 1vw;
}
#marketing-support .feature-flow-item ul{
box-shadow: 0 0.8vw 0.8vw 0 rgba(0,0,0,0.1);
font-size: 2.4vw;
min-height: 6.5em;
}
} #freeconsulting{
font-size: 15px;
}
#freeconsulting .container{
max-width: 800px;
}
#freeconsulting .nowrap{
display: inline-block;
text-indent: 0;
font-size: inherit;
}
#freeconsulting .nowrap:before{
display: none;
}
#freeconsulting h1{
margin: -1em 0 0.8em;
}
#freeconsulting section{
margin-bottom: 50px;
}
#freeconsulting .sec_ttl{
font-size: 22px;
font-weight: bold;
letter-spacing: 0.05em;
line-height: 1.3;
position: relative;
padding: 0.1em 0 0.1em 0.5em;
border-bottom: 1px solid #CC0000;
border-left: 7px solid #CC0000;
position: relative;
}
#freeconsulting .mv{
text-align: center;
}
#freeconsulting .mv img{
width: 85%;
max-width: 500px;
}
#freeconsulting .target_list li{
position: relative;
line-height: 1.3;
padding: 0 0 1em 1.5em;
text-indent: -1.5em;
}
#freeconsulting .target_list li:last-child{
margin-bottom: 0;
}
#freeconsulting .target_list li:before{
content: "";
display: inline-block;
width: 15px;
height: 15px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/onlineseminar/checkmark.svg) center no-repeat;
background-size: contain;
margin-right: 0.5em;
}
#freeconsulting .contents_list{
background: rgba(203,0,0,0.05);
border-radius: 10px;
padding: 1em 1em;
}
#freeconsulting .contents_list li{
position: relative;
line-height: 1.3;
margin-bottom: 1em;
text-indent: -1em;
padding-left: 1em;
}
#freeconsulting .contents_list li:last-child{
margin-bottom: 0;
}
#freeconsulting .contents_list li:before{
content: "";
display: inline-block;
background: #cc0000;
width: 10px;
height: 10px;
border-radius: 5px;
margin-right: 0.5em;
position: relative;
vertical-align: middle;
bottom: 1px;
}
#freeconsulting .consultant_list{
display: flex;
justify-content: center;
flex-wrap: wrap;
padding-top: 20px;
}
#freeconsulting .consultant_list li{
width: 47%;
margin-right: 3%;
text-align: center;
max-width: 300px;
}
#freeconsulting .consultant_list li:last-child{
margin-left: 3%;
}
#freeconsulting .consultant_list li img{
width: 190px;
height: 190px;
display: inline-block;
object-fit: cover;
object-position: top;
border-radius: 95px;
margin-bottom: 1em;
}
#freeconsulting .consultant_list li .name{
font-weight: bold;
font-size: 20px;
letter-spacing: 0.05em;
margin-bottom: 0.5em;
}
#freeconsulting .consultant_list li .description{
line-height: 1.5;
}
#freeconsulting .outline_list{
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}
#freeconsulting .outline_list dt{
width: 8em;
}
#freeconsulting .outline_list dd{
width: calc(100% - 8em);
}
#freeconsulting .voice_list li{
position: relative;
line-height: 1.3;
margin-bottom: 1em;
text-indent: -1em;
padding-left: 1em;
}
#freeconsulting .voice_list li:last-child{
margin-bottom: 0;
}
#freeconsulting .voice_list li:before{
content: "";
display: inline-block;
background: #cc0000;
width: 10px;
height: 10px;
border-radius: 5px;
margin-right: 0.5em;
position: relative;
vertical-align: middle;
bottom: 1px;
}
@media screen and (max-width: 767px){
#freeconsulting h1{
font-size: 26px;
}
#freeconsulting .contents_list li{
width: 100%;
}
#freeconsulting .consultant_list li{
width: 100%;
margin-right: 0;
margin-bottom: 30px;
max-width: inherit;
}
#freeconsulting .consultant_list li:last-child{
margin-left: 0;
}
#freeconsulting .consultant_list li br.pc{
display: none;
}
#freeconsulting .consultant_list li .description{
text-align: left;
display: inline-block;
}
#freeconsulting .outline_list dt{
width: 6em;
}
#freeconsulting .outline_list dd{
width: calc(100% - 6em);
}
}
@media screen and (max-width: 480px){
#freeconsulting{
font-size: 14px;
}
#freeconsulting h1{
font-size: 22px;
}
#freeconsulting .sec_ttl{
font-size: 18px;
}
} #freeconsulting.trial_campaign .mv{
max-width: 100%;
width: 100%;
}
#freeconsulting.trial_campaign a{
text-decoration: underline;
color: #2771bc;
}
#freeconsulting.trial_campaign .outline_list dt{
width: 7em;
}
#freeconsulting.trial_campaign .outline_list dd{
width: calc(100% - 7em);
}
#freeconsulting .outline_list strong{
font-weight: bold;
color: #CC0000;
}
#freeconsulting .ttl_note{
color: #CC0000;
text-align: center;
margin-top: -0.5em;
line-height: 1.3;
}
#freeconsulting.trial_campaign .btn_contact{
text-align: center;
margin: 70px 0 70px;
}
#freeconsulting.trial_campaign .btn_contact p{
font-size: 18px;
font-weight: bold;
margin-bottom: 0.5em;
}
#freeconsulting.trial_campaign .btn_contact a{
width: 100%;
max-width: 400px;
height: 55px;
background: #cc0000;
border-radius: 27.5px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
margin: 0 auto;
text-decoration: none;
font-size: 18px;
opacity: 1;
transition: .3s all ease;
font-weight: bold;
}
#freeconsulting.trial_campaign .btn_contact a:hover{
transform: scale(1.1);
box-shadow: 0 5px 10px rgba(0,0,0,0.3);
}
@media screen and (max-width: 480px){
#freeconsulting .ttl_note{
font-size: 17px;
}
#freeconsulting.trial_campaign .btn_contact p{
font-size: 14px;
}
#freeconsulting.trial_campaign .btn_contact a{
height: 50px;
font-size: 14px;
}
#freeconsulting.trial_campaign .btn_contact a:hover{
transform: scale(1.05);
box-shadow: 0 4px 7px rgba(0,0,0,0.3);
}
} #hy-lp-rpa {
background: #fff;
color: #000;
padding-top: 70px;
}
#hy-lp-rpa section .container,
#hy-lp-rpa .section .container {
width: 95%;
max-width: 920px;
height: 100%;
margin: 0 auto;
position: relative;
z-index: 3;
padding: 0;
}
#hy-lp-rpa .sp {
display: none !important;
}
@media screen and (max-width: 767px) {
#hy-lp-rpa .sp {
display: block !important;
}
}
@media screen and (max-width: 767px) {
#hy-lp-rpa .pc {
display: none !important;
}
}
#hy-lp-rpa .nowrap {
display: inline-block;
}
#hy-lp-rpa .btn-contact {
width: 284px;
height: 66px;
border-radius: 33px;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
background: #FEDC3D;
font-size: 30px;
font-weight: bold;
text-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
margin: 0 auto;
text-decoration: none;
transition: .3s all ease;
border: 3px solid #FEDC3D;
}
#hy-lp-rpa .btn-contact:hover {
opacity: 1;
color: #FEDC3D;
background: #fff;
transform: scale(1.1);
}
@media screen and (max-width: 1090px) {
#hy-lp-rpa .btn-contact {
width: 29.3vw;
height: 6.8vw;
border-radius: 3.4vw;
font-size: 3.1vw;
text-shadow: 0 0.4vw 0.4vw rgba(0, 0, 0, 0.1);
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.25);
}
}
@media screen and (max-width: 767px) {
#hy-lp-rpa .btn-contact {
width: 42.1vw;
height: 10.7vw;
border-radius: 5.35vw;
font-size: 4.8vw;
text-shadow: 0 1.1vw 1.1vw rgba(0, 0, 0, 0.1);
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.25);
}
}
@media screen and (max-width: 480px) {
#hy-lp-rpa .btn-contact {
width: 50vw;
height: 13vw;
font-size: 5.5vw;
border-radius: 6.5vw;
}
}
#hy-lp-rpa header h1 {
margin-bottom: 0;
}
#hy-lp-rpa header h1 span:before {
content: none;
}
#hy-lp-rpa .mv {
position: relative;
background: #fff;
}
#hy-lp-rpa .mv .container {
max-width: 1200px;
position: relative;
padding: 90px 0;
z-index: 3;
}
#hy-lp-rpa .mv .mv_img {
position: absolute;
right: 0;
top: 90px;
width: 40%;
z-index: 0;
}
#hy-lp-rpa .mv .txt {
position: relative;
width: 60%;
z-index: 1;
}
#hy-lp-rpa .mv h2 {
background: #2673B8;
color: #fff;
font-size: 27px;
padding: 0.5em;
margin-bottom: 60px;
line-height: 1.3;
font-weight: bold;
display: inline-block;
}
#hy-lp-rpa .mv h1 {
color: #2673B8;
font-size: 39px;
font-weight: bold;
line-height: 1.3;
margin-bottom: 20px;
display: inline-block;
text-align: left;
}
#hy-lp-rpa .mv h1 + p {
color: #2673B8;
margin-bottom: 60px;
}
#hy-lp-rpa .mv .link_button {
width: 340px;
}
@media screen and (max-width: 1090px) {
#hy-lp-rpa .mv .mv_img {
top: 8.3vw;
width: 50.5vw;
}
#hy-lp-rpa .mv .txt {
width: 44.5vw; }
#hy-lp-rpa .mv h2 {
font-size: 2.5vw;
margin-bottom: 5.5vw;
}
#hy-lp-rpa .mv h1 {
font-size: 3.5vw;
margin-bottom: 5.5vw;
}
#hy-lp-rpa .mv .link_button {
margin-top: 8.0vw;
}
}
@media screen and (max-width: 767px) {
#hy-lp-rpa .mv .mv_img {
position: relative;
right: auto;
top: auto;
width: 100%;
}
#hy-lp-rpa .mv .txt {
width: 82.4vw;
margin: 0 auto;
text-align: center;
}
#hy-lp-rpa .mv h2 {
font-size: 4.8vw;
margin-bottom: 12.0vw;
}
#hy-lp-rpa .mv h1 {
font-size: 5.9vw;
margin-bottom: 5.7vw;
display: inline-block;
text-align: center;
}
#hy-lp-rpa .mv .link_button {
width: 42.1vw;
}
}
@media screen and (max-width: 480px) {
#hy-lp-rpa .mv h1 {
font-size: 6.5vw;
}
#hy-lp-rpa .mv .link_button {
width: 70vw;
}
}
#hy-lp-rpa section {
position: relative;
padding: 85px 0;
}
#hy-lp-rpa .sec-ttl {
text-align: center;
position: relative;
font-size: 30px;
margin: 0 0 3.5em;
}
#hy-lp-rpa .sec-ttl h2 {
font-size: inherit;
font-weight: bold;
line-height: 1.3;
margin-bottom: 0;
}
#hy-lp-rpa .sec-ttl p {
font-size: 20px;
line-height: 1.5;
margin-bottom: 0;
}
#hy-lp-rpa .sec-ttl:after {
content: "";
display: block;
width: 80px;
height: 6px;
background: #FEDC3D;
position: absolute;
bottom: -1.3em;
left: calc(50% - 40px);
}
#hy-lp-rpa .large {
text-align: center;
position: relative;
font-size: 30px;
font-weight: bold;
line-height: 1.3;
}
@media screen and (max-width: 985px) {
#hy-lp-rpa .large,
#hy-lp-rpa .sec-ttl {
font-size: 3.1vw;
}
#hy-lp-rpa .sec-ttl p {
font-size: 2.1vw;
}
#hy-lp-rpa .sec-ttl:after {
width: 8.3vw;
height: 0.6vw;
left: calc(50% - 4.1vw);
}
}
@media screen and (max-width: 767px) {
#hy-lp-rpa .large,
#hy-lp-rpa .sec-ttl {
font-size: 4.8vw;
}
#hy-lp-rpa .sec-ttl p {
font-size: 3.2vw;
}
#hy-lp-rpa .sec-ttl:after {
width: 13.3vw;
height: 1.6vw;
left: calc(50% - 6.67vw);
}
}
@media screen and (max-width: 480px) {
#hy-lp-rpa .large,
#hy-lp-rpa .sec-ttl {
font-size: 5.5vw;
}
#hy-lp-rpa .sec-ttl p {
font-size: 4vw;
}
}
#hy-lp-rpa #sec-problem {
background: #DBF3FF;
}
#hy-lp-rpa #sec-problem .problem-list {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 60px;
}
#hy-lp-rpa #sec-problem .problem-list li {
width: 30%;
display: flex;
flex-wrap: wrap;
}
#hy-lp-rpa #sec-problem .problem-list li .photo {
position: relative;
border-radius: 50%;
margin: 0 auto;
background-color: rgb(0,0,0);
}
#hy-lp-rpa #sec-problem .problem-list li img {
width: 100%;
height: auto;
opacity: .8;
}
#hy-lp-rpa #sec-problem .problem-list li h3 {
position: absolute;
line-height: 1.3;
width: 100%;
text-align: center;
color: #fff;
font-size: 28px;
font-weight: normal;
top: calc(50% - 28.2px);
}
#hy-lp-rpa #sec-problem .problem-list li p {
width: 100%;
background: #fff;
font-size: 16px;
line-height: 1.3;
padding: 1.8em 1.8em 1.5em;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.1);
margin: 1.3em 0 0;
}
@media screen and (max-width: 985px) {
#hy-lp-rpa #sec-problem .problem-list li h3 {
font-size: 2.9vw;
top: calc(50% - 2.9vw);
}
#hy-lp-rpa #sec-problem .problem-list li p {
font-size: 1.7vw;
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.1);
}
}
@media screen and (max-width: 767px) {
#hy-lp-rpa #sec-problem .problem-list {
width: 73.3vw;
margin: 0 auto;
justify-content: center;
}
#hy-lp-rpa #sec-problem .problem-list li {
width: 100%;
margin-bottom: 13.3vw;
}
#hy-lp-rpa #sec-problem .problem-list li img {
width: 60vw;
display: block;
margin: 0 auto;
}
#hy-lp-rpa #sec-problem .problem-list li h3 {
font-size: 6vw;
top: calc(50% - 6vw);
}
#hy-lp-rpa #sec-problem .problem-list li p {
font-size: 3.2vw;
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.1);
min-height: inherit;
margin-top: 2em;
padding: 2.5em;
}
}
@media screen and (max-width: 480px) {
#hy-lp-rpa #sec-problem .problem-list li p {
font-size: 4vw;
}
}
#hy-lp-rpa #sec-service .inner{
width: 100%;
max-width: 1000px;
margin: 0 auto;
}
#hy-lp-rpa #sec-service .kv{
position: relative;
margin-bottom: 50px;
}
#hy-lp-rpa #sec-service .kv .inner,
#hy-lp-rpa #sec-service .message .inner{
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
}
#hy-lp-rpa #sec-service .kv h2{
line-height: 1.5;
font-size: 26px;
font-weight: 500;
text-align: left;
letter-spacing: 0.05em;
width: calc(100% - 420px);
}
#hy-lp-rpa #sec-service .kv h2 strong{
color: #CB0000;
font-size: 30px;
}
#hy-lp-rpa #sec-service .kv .img{
width: 100%;
max-width: 400px;
}
#hy-lp-rpa #sec-service .kv .img img{
width: 100%;
}
#hy-lp-rpa #sec-service .message{
margin-bottom: 50px;
text-align: right;
}
#hy-lp-rpa #sec-service .message .inner{
flex-direction: row-reverse;
}
#hy-lp-rpa #sec-service .message .txt{
text-align: left;
width: calc(100% - 410px);
}
#hy-lp-rpa #sec-service .message h3{
font-size: 26px;
font-weight: 500;
line-height: 1.5;
margin-bottom: 0.5em;
}
#hy-lp-rpa #sec-service .message h3 strong{
color: #CB0000;
}
#hy-lp-rpa #sec-service .message p{
font-size: 16px;
line-height: 1.5;
}
#hy-lp-rpa #sec-service .message .img{
width: 100%;
max-width: 380px;
}
#hy-lp-rpa #sec-service .message .img img{
width: 100%;
}
@media screen and (max-width: 767px){
#hy-lp-rpa #sec-service .kv .inner,
#hy-lp-rpa #sec-service .message .inner{
display: block;
}
#hy-lp-rpa #sec-service .kv h2,
#hy-lp-rpa #sec-service .message .txt{
width: 100%;
text-align: center;
}
#hy-lp-rpa #sec-service .kv .img,
#hy-lp-rpa #sec-service .message .img{
margin: 0 auto;
width: 100%;
}
#hy-lp-rpa #sec-service .kv{
margin-bottom: 7vw;
}
#hy-lp-rpa #sec-service .kv h2{
font-size: 3.6vw;
}
#hy-lp-rpa #sec-service .kv h2 strong{
font-size: 5.7vw;
}
#hy-lp-rpa #sec-service .message{
margin-bottom: 7vw;
}
#hy-lp-rpa #sec-service .message h3{
font-size: 3.3vw;
}
#hy-lp-rpa #sec-service .message p{
font-size: 2.4vw;
}
}
@media screen and (max-width: 530px){
#hy-lp-rpa #sec-service .kv{
margin-bottom: 10vw;
}
#hy-lp-rpa #sec-service .kv h2{
font-size: 5vw;
text-align: center;
}
#hy-lp-rpa #sec-service .kv h2 strong{
font-size: 7.5vw;
}
#hy-lp-rpa #sec-service .kv .img{
width: 100%;
position: relative;
}
#hy-lp-rpa #sec-service .message{
margin-bottom: 10vw;
}
#hy-lp-rpa #sec-service .message .txt{
display: block;
text-align: center;
}
#hy-lp-rpa #sec-service .message h3{
font-size: 5.2vw;
}
#hy-lp-rpa #sec-service .message p{
font-size: 3.7vw;
margin-bottom: 1em;
}
#hy-lp-rpa #sec-service .message .img{
width: 100%;
text-align: center;
position: relative;
}
#hy-lp-rpa #sec-service .message .img img{
width: 95%;
}
}
#hy-lp-rpa #sec-flow {
background-color: #F2F0F0;
text-align: center;
}
#hy-lp-rpa #sec-flow .container {
z-index: 4;
max-width: 1051px;
}
#hy-lp-rpa #sec-flow .lead {
font-size: 27px;
line-height: 1.3;
display: inline-block;
text-align-last: left;
margin-bottom: 80px;
}
#hy-lp-rpa #sec-flow .flow-list {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
}
#hy-lp-rpa #sec-flow .flow-list li {
width: 317px;
height: 317px;
background: #fff;
display: flex;
align-items: flex-start;
justify-content: center;
border-radius: 158.5px;
padding-top: 45px;
position: relative;
}
#hy-lp-rpa #sec-flow .flow-list li .contents {
text-align: center;
width: 200px;
}
#hy-lp-rpa #sec-flow .flow-list li .icon {
width: 64px;
height: 64px;
}
#hy-lp-rpa #sec-flow .flow-list li .step {
color: #FEDC3D;
font-size: 18px;
font-weight: bold;
margin: 0.5em 0 1em;
line-height: 1.3;
}
#hy-lp-rpa #sec-flow .flow-list li h3 {
font-weight: bold;
font-size: 24px;
line-height: 1.3;
}
#hy-lp-rpa #sec-flow .flow-list li .description {
margin: 0.2em 0 0;
font-size: 16px;
line-height: 1.3;
text-align: left;
}
#hy-lp-rpa #sec-flow .flow-list li:after {
content: "";
display: block;
width: 0;
height: 0;
border-style: solid;
border-width: 18px 0 18px 34px;
border-color: transparent transparent transparent #FEDC3D;
position: absolute;
right: -43px;
top: calc(50% - 18px);
}
#hy-lp-rpa #sec-flow .flow-list li:last-child:after {
display: none;
}
@media screen and (max-width: 1090px) {
#hy-lp-rpa #sec-flow .container {
width: 98%;
}
#hy-lp-rpa #sec-flow .flow-list li {
width: 29vw;
height: 29vw;
border-radius: 14.5vw;
padding-top: 3vw;
}
#hy-lp-rpa #sec-flow .flow-list li .contents {
width: 20.7vw;
}
#hy-lp-rpa #sec-flow .flow-list li .icon {
width: 6.6vw;
height: 6.6vw;
}
#hy-lp-rpa #sec-flow .flow-list li .step {
font-size: 1.9vw;
margin: 0.5em 0 0.3em;
}
#hy-lp-rpa #sec-flow .flow-list li h3 {
font-size: 2.3vw;
}
#hy-lp-rpa #sec-flow .flow-list li .description {
font-size: 1.5vw;
}
#hy-lp-rpa #sec-flow .flow-list li:after {
border-color: transparent transparent transparent #FEDC3D;
border-width: 1.9vw 0 1.9vw 3.4vw;
right: -4.3vw;
top: calc(50% - 1.9vw);
}
}
@media screen and (max-width: 985px) {
#hy-lp-rpa #sec-flow .lead {
font-size: 2.8vw;
margin-bottom: 8.3vw;
}
}
@media screen and (max-width: 767px) {
#hy-lp-rpa #sec-flow .container {
width: 95%;
}
#hy-lp-rpa #sec-flow .lead {
font-size: 3.2vw;
margin-bottom: 8.0vw;
}
#hy-lp-rpa #sec-flow .flow-list {
justify-content: center;
flex-wrap: wrap;
}
#hy-lp-rpa #sec-flow .flow-list li {
width: 75.5vw;
height: 75.5vw;
border-radius: 37.75vw;
padding-top: 12.5vw;
margin-bottom: 14.4vw;
}
#hy-lp-rpa #sec-flow .flow-list li:last-child {
margin-bottom: 0;
}
#hy-lp-rpa #sec-flow .flow-list li .contents {
width: 40.0vw;
}
#hy-lp-rpa #sec-flow .flow-list li .icon {
width: 15.2vw;
height: 15.2vw;
}
#hy-lp-rpa #sec-flow .flow-list li .step {
font-size: 4.8vw;
}
#hy-lp-rpa #sec-flow .flow-list li h3 {
font-size: 4.3vw;
}
#hy-lp-rpa #sec-flow .flow-list li .description {
margin: 0.8em 0 0;
font-size: 3.2vw;
}
#hy-lp-rpa #sec-flow .flow-list li:after {
border-color: #FEDC3D transparent transparent transparent;
right: calc(50% - 5vw);
top: auto;
bottom: -12vw;
border-width: 9vw 5vw 0 5vw;
}
}
@media screen and (max-width: 480px) {
#hy-lp-rpa #sec-flow .lead {
font-size: 4vw;
}
#hy-lp-rpa #sec-flow .lead br {
display: none;
}
#hy-lp-rpa #sec-flow .flow-list li {
padding-top: 9vw;
}
#hy-lp-rpa #sec-flow .flow-list li .contents {
width: 46.0vw;
}
#hy-lp-rpa #sec-flow .flow-list li .step {
font-size: 5vw;
}
#hy-lp-rpa #sec-flow .flow-list li h3 {
font-size: 4.5vw;
}
#hy-lp-rpa #sec-flow .flow-list li .description {
font-size: 4vw;
}
}
#hy-lp-rpa #sec-case .inner{
width: 100%;
max-width: 1000px;
margin: 0 auto;
}
#hy-lp-rpa #sec-case .case{
margin-bottom: 50px;
text-align: right;
}
#hy-lp-rpa #sec-case .case .inner{
position: relative;
display: flex;
justify-content: space-between;
flex-direction: row-reverse;
align-items: center;
}
#hy-lp-rpa #sec-case .case .txt{
text-align: left;
width: calc(100% - 410px);
}
#hy-lp-rpa #sec-case .case h3{
font-size: 26px;
font-weight: 500;
line-height: 1.5;
margin-bottom: 0.5em;
}
#hy-lp-rpa #sec-case .case h3 strong{
color: #CB0000;
}
#hy-lp-rpa #sec-case .case p{
font-size: 16px;
line-height: 1.5;
}
#hy-lp-rpa #sec-case .case .img{
width: 100%;
max-width: 380px;
}
#hy-lp-rpa #sec-case .case .img img{
width: 100%;
}
@media screen and (max-width: 767px){
#hy-lp-rpa #sec-case .case .inner{
display: block;
}
#hy-lp-rpa #sec-case .case .txt{
width: 100%;
text-align: center;
}
#hy-lp-rpa #sec-case .case .img{
margin: 0 auto;
width: 100%;
}
#hy-lp-rpa #sec-case .case{
margin-bottom: 7vw;
}
#hy-lp-rpa #sec-case .case h3{
font-size: 3.3vw;
}
#hy-lp-rpa #sec-case .case p{
font-size: 2.4vw;
}
}
@media screen and (max-width: 530px){
#hy-lp-rpa #sec-case .case{
margin-bottom: 10vw;
}
#hy-lp-rpa #sec-case .case .txt{
display: block;
text-align: center;
}
#hy-lp-rpa #sec-case .case h3{
font-size: 5.2vw;
}
#hy-lp-rpa #sec-case .case p{
font-size: 3.7vw;
margin-bottom: 1em;
}
#hy-lp-rpa #sec-case .case .img{
width: 100%;
text-align: center;
position: relative;
}
#hy-lp-rpa #sec-case .case .img img{
width: 95%;
}
}
#hy-lp-rpa #sec-price {
background-color: #F2F0F0;
}
#hy-lp-rpa #sec-price .container .price {
width: 100%;
}
#hy-lp-rpa #sec-price .container .price .set {
width: 640px;
margin: 0 auto 40px auto;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: stretch;
}
#hy-lp-rpa #sec-price .container .price .set + p {
text-align: center;
}
#hy-lp-rpa #sec-price .container .price .set .data {
width: 310px;
padding: 0 0 5px;
margin: 0;
border-radius: 10px;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
align-items: stretch;
}
#hy-lp-rpa #sec-price .container .price .set .data dl {
width: 100%;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
}
#hy-lp-rpa #sec-price .container .price .set .data dl dt {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
align-items: flex-end;
margin-bottom: 10px;
}
#hy-lp-rpa #sec-price .container .price .set .data dl dd {
box-sizing: border-box;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan1 {
background-color: #CB0000;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan1 dl dt span:nth-child(1) {
color: #FFF;
font-family: "Noto Sans JP", sans-serif;
font-size: 40px;
font-weight: 500;
line-height: 100%;
letter-spacing: 0em;
font-feature-settings: "palt";
}
#hy-lp-rpa #sec-price .container .price .set .data.plan1 dl dt span:nth-child(2) {
color: #FFF;
font-family: "Noto Sans JP", sans-serif;
font-size: 24px;
font-weight: 500;
line-height: 100%;
letter-spacing: 0em;
font-feature-settings: "palt";
margin: 0 0 0 5px;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan1 dl dt span:nth-child(3) {
color: #FFF;
font-family: "Noto Sans JP", sans-serif;
font-size: 14px;
font-weight: 500;
line-height: 100%;
letter-spacing: 0em;
font-feature-settings: "palt";
margin: 0 0 0 5px;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan1 dl dd:first-child {
color: #FFF;
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 100%;
letter-spacing: 0em;
font-feature-settings: "palt";
padding: 5px 20px;
margin-bottom: 10px;
border: solid 1px #FFF;
border-radius: 10px;
display: inline-block;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan1 dl dd:last-child {
color: #111;
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 2.6rem;
letter-spacing: 0em;
font-feature-settings: "palt";
text-align: center;
width: 100%;
padding: 10px;
background-color: #FFF;
border-radius: 0 0 8px 8px;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan2 {
background-color: #EBE3DE;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan2 dl dt {
color: #111;
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
font-weight: 500;
line-height: 2.6rem;
letter-spacing: 0em;
font-feature-settings: "palt";
margin-top: auto;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan2 dl dd {
color: #CB0000;
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 100%;
letter-spacing: 0em;
font-feature-settings: "palt";
padding: 5px 20px;
margin-bottom: 10px;
border: solid 1px #CB0000;
border-radius: 10px;
display: inline-block;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan2 dl dt span:nth-child(1) {
color: #CB0000;
font-family: "Noto Sans JP", sans-serif;
font-size: 40px;
font-weight: 500;
line-height: 100%;
letter-spacing: 0em;
font-feature-settings: "palt";
}
#hy-lp-rpa #sec-price .container .price .set .data.plan2 dl dt span:nth-child(2) {
color: #CB0000;
font-family: "Noto Sans JP", sans-serif;
font-size: 24px;
font-weight: 500;
line-height: 100%;
letter-spacing: 0em;
font-feature-settings: "palt";
margin: 0 0 0 5px;
}
#hy-lp-rpa #sec-price .container .price .set .data.plan2 dl dd:last-child {
color: #CB0000;
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 2.6rem;
letter-spacing: 0em;
font-feature-settings: "palt";
text-align: center;
width: 100%;
padding: 5px 10px;
margin-bottom: 0;
border: none;
}
@media screen and (max-width: 700px){
#hy-lp-rpa #sec-price .container .price .set {
display: block;
width: 100%;
}
#hy-lp-rpa #sec-price .container .price .set .data {
width: 100%;
margin-bottom: 20px;
}
}
#hy-lp-rpa #sec-faq .faq-list li {
border-radius: 55px;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
margin-bottom: 80px;
overflow: hidden;
}
#hy-lp-rpa #sec-faq .faq-list li:last-child {
margin-bottom: 0;
}
#hy-lp-rpa #sec-faq .faq-list li h3 {
color: #fff;
background: #2673B8;
font-weight: bold;
font-size: 27px;
text-align: center;
padding: 0.7em 0.5em;
line-height: 1.2;
}
#hy-lp-rpa #sec-faq .faq-list li h3 .txt {
position: relative;
display: inline-block;
padding: 0 0 0 70px;
max-width: 785px;
text-align: left;
}
#hy-lp-rpa #sec-faq .faq-list li h3 .txt:before {
content: "";
display: inline-block;
width: 50px;
height: 50px;
background: url(https://help-you.me../../hy/img/marketing_support/icon_question.png) center no-repeat;
background-size: contain;
position: absolute;
left: 0;
top: calc(50% - 25px);
}
#hy-lp-rpa #sec-faq .faq-list li .answer {
font-size: 18px;
padding: 2em 0;
background: #fff;
}
#hy-lp-rpa #sec-faq .faq-list li .answer p {
font-size: inherit;
line-height: 1.3;
margin: 0 auto;
max-width: 600px;
}
@media screen and (max-width: 985px) {
#hy-lp-rpa #sec-faq {
padding: 5.2vw 0 26.9vw;
}
#hy-lp-rpa #sec-faq .faq-list li {
border-radius: 5.7vw;
box-shadow: 0 0.4vw 0.4vw 0 rgba(0, 0, 0, 0.25);
margin-bottom: 8.3vw;
}
#hy-lp-rpa #sec-faq .faq-list li h3 {
font-size: 2.8vw;
}
#hy-lp-rpa #sec-faq .faq-list li h3 .txt {
padding: 0 0 0 7.2vw;
max-width: 81.1vw;
}
#hy-lp-rpa #sec-faq .faq-list li h3 .txt:before {
width: 5.2vw;
height: 5.2vw;
top: calc(50% - 2.6vw);
}
#hy-lp-rpa #sec-faq .faq-list li .answer {
font-size: 1.9vw;
}
#hy-lp-rpa #sec-faq .faq-list li .answer p {
max-width: 62.0vw;
}
}
@media screen and (max-width: 767px) {
#hy-lp-rpa #sec-faq .faq-list li {
border-radius: 6.7vw;
box-shadow: 0 1.1vw 1.1vw 0 rgba(0, 0, 0, 0.25);
margin-bottom: 10.7vw;
}
#hy-lp-rpa #sec-faq .faq-list li h3 {
font-size: 4.3vw;
}
#hy-lp-rpa #sec-faq .faq-list li h3 .txt {
padding: 0 0 0 8.0vw;
max-width: inherit;
}
#hy-lp-rpa #sec-faq .faq-list li h3 .txt:before {
width: 6.4vw;
height: 6.4vw;
top: calc(50% - 3.2vw);
}
#hy-lp-rpa #sec-faq .faq-list li .answer {
font-size: 3.2vw;
padding: 1.5em 1em;
}
#hy-lp-rpa #sec-faq .faq-list li .answer p {
max-width: inherit;
}
}
@media screen and (max-width: 480px) {
#hy-lp-rpa #sec-faq .faq-list li .answer {
font-size: 4vw;
}
}
#hy-lp-rpa footer.siteFooter .container {
max-width: 940px;
}
#hy-lp-rpa footer.siteFooter .container.sectionBox {
padding-top: 2em;
padding-bottom: 2em;
} #hy_pricing .campaign {
color: #cc0000;
font-size: 20px;
font-weight: bold;
margin: 30px 0 10px;
}
#hy_pricing .note {
font-size: 12px;
margin: 10px 0 30px;
}
#hy_pricing .plan_list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-top: 30px;
}
#hy_pricing .plan_list_item {
display: flex;
flex-direction: column;
width: 31%;
margin-bottom: 25px;
padding: 0 15px 15px;
border: 1px solid #cc0000;
border-radius: 10px;
text-align: center;
}
#hy_pricing .plan_list_item h2 {
font-size: 24px;
background-color: #cc0000;
color: #fff;
border-radius: 9px 9px 0 0;
margin: 0 -15px 15px;
padding: 15px;
}
#hy_pricing .plan_list_item .price {
margin: 10px -15px;
font-size: 30px;
}
#hy_pricing .plan_list_item .price span {
font-weight: bold;
font-size: 40px;
}
#hy_pricing .plan_list_item .time {
height: 2em;
}
#hy_pricing .plan_list_item .time span {
border: 1px solid #cc0000;
border-radius: 6px;
display: inline-block;
line-height: 1.9em;
padding: 0 10px;
}
#hy_pricing .plan_list_item .img {
margin: 10px 0;
}
#hy_pricing .plan_list_item .text {
margin-bottom: 10px;
}
#hy_pricing .plan_list_item .text span {
font-weight: bold;
}
#hy_pricing .plan_list_item .btn {
margin-top: auto;
}
#hy_pricing .plan_list_item .btn a {
display: block;
margin-left: auto;
margin-right: auto;
padding: 10px 0;
max-width: 11em;
font-size: 16px;
font-weight: bold;
color: #cc0000;
background-color: #F9E5E6;
border: 3px solid #cc0000;
border-radius: 100px;
}
#hy_pricing .plan_list_item .btn a:hover {
color: #fff;
background-color: #cc0000;
text-decoration: none;
}
#hy_pricing .plan_list_item:nth-child(2),
#hy_pricing .plan_list_item:nth-child(2) .time span {
border-color: #F28A70;
}
#hy_pricing .plan_list_item:nth-child(2) h2 {
background-color: #F28A70;
}
#hy_pricing .plan_list_item:nth-child(3),
#hy_pricing .plan_list_item:nth-child(3) .time span {
border-color: #80A6B9;
}
#hy_pricing .plan_list_item:nth-child(3) h2 {
background-color: #80A6B9;
}
#hy_pricing h3.sec_ttl {
color: #fff!important;
background: #cc0000;
font-size: 28px;
margin-bottom: 2em;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
}
#hy_pricing .plan_detail {
margin: 80px 0 120px;
}
#hy_pricing .plan_detail_table th,
#hy_pricing .plan_detail_table td {
font-size: 14px;
padding: 25px 15px;
border-bottom: 1px solid #E4E4E4;
}
#hy_pricing .plan_detail_table thead th {
font-size: 24px;
font-weight: bold;
color: #cc0000;
width: 28.5%;
}
#hy_pricing .plan_detail_table thead th:first-child {
width: 14.5%;
}
#hy_pricing .plan_detail_table tbody th {
font-weight: bold;
}
#hy_pricing .plan_detail_table tbody td span {
font-size: .8em;
}
#hy_pricing .contact {
margin-bottom: 80px;
}
#hy_pricing .contact h4 {
color: #CB0000;
font-family: "Noto Sans JP", sans-serif;
font-size: 30px;
font-weight: 400;
line-height: 100%;
letter-spacing: 0.1em;
text-align: center;
-webkit-font-feature-settings: "palt";
font-feature-settings: "palt";
margin-bottom: 30px;
}
@media screen and (max-width: 991px) {
#hy_pricing h3.sec_ttl {
padding: 0.7em 3em 0.7em 1em;
}
}
@media screen and (max-width: 479px) {
#hy_pricing h3.sec_ttl{
font-size: 20px;
}
}
@media screen and (max-width: 767px) {
#hy_pricing .plan_list_item {
width: 100%;
padding-left: 25px;
padding-right: 25px;
}
#hy_pricing .plan_list_item h2 {
margin-left: -25px;
margin-right: -25px;
}
#hy_pricing .plan_detail_table th,
#hy_pricing .plan_detail_table td {
display: block;
padding: 15px;
}
#hy_pricing .plan_detail_table thead th {
display: none;
}
#hy_pricing .plan_detail_table tbody th {
position: relative;
margin-top: -1px;
padding-left: 0;
font-size: 16px;
border-top: 1px solid #B6B6B6;
border-bottom: 1px solid #B6B6B6;
cursor: pointer;
}
#hy_pricing .plan_detail_table tbody td {
padding-left: 9em;
}
#hy_pricing .plan_detail_table tbody th::after {
content: '';
display: block;
width: 10px;
height: 10px;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
position: absolute;
right: 15px;
top: 20px;
transform: rotate(45deg);
}
#hy_pricing .plan_detail_table tbody th.on::after {
top: 25px;
transform: rotate(-135deg);
}
#hy_pricing .plan_detail_table tbody td::before {
display:  block;
color: #cc0000;
font-weight: bold;
margin-left: -8em;
margin-bottom: -1.5em;
}
#hy_pricing .plan_detail_table tbody td:nth-of-type(1)::before {
content: 'チームプラン';
}
#hy_pricing .plan_detail_table tbody td:nth-of-type(2)::before {
content: '1名専属プラン';
}
#hy_pricing .plan_detail_table tbody td:nth-of-type(3)::before {
content: 'ロボットプラン';
}
#hy_pricing .contact {
margin-bottom: 25px;
}
#hy_pricing .contact h4 {
font-size: 20px;
line-height: 30px;
margin-bottom: 15px;
}
} .post-name-care .siteContent {
padding: 0;
}
.post-name-care .mainSection {
margin-bottom: 0;
}
#care {
background: #fff;
color: #000;
line-height: 1.6;
letter-spacing: 0.2em;
}
#care .container {
width: 95%;
max-width: 1090px;
height: 100%;
margin: 0 auto;
position: relative;
z-index: 3;
padding: 0;
}
#care .sp {
display: none !important;
}
@media screen and (max-width: 767px) {
#care .sp {
display: block !important;
}
}
@media screen and (max-width: 767px) {
#care .pc {
display: none !important;
}
}
#care .nowrap {
display: inline-block;
}
#care .btn-contact {
width: 15em;
height: 2.6em;
border-radius: 1.3em;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
background: #b72d28;
font-size: 20px;
font-weight: bold;
margin: 0 auto;
text-decoration: none;
transition: .3s all ease;
border: 3px solid #b72d28;
}
#care .btn-contact:hover {
opacity: 1;
color: #b72d28;
background: #fbf4f3;
transform: scale(1.1);
}
#care .btn-contact span {
position: relative;
padding-right: 1em;
}
#care .btn-contact span:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0.5em 0 0.5em 0.6em;
border-color: transparent transparent transparent #fbf4f3;
position: absolute;
top: calc(50% - 0.5em); right: 0;
}
#care .btn-contact:hover span:after {
border-color: transparent transparent transparent #b72d28;
}
@media screen and (max-width: 1090px) {
#care .btn-contact {
font-size: 2vw;
}
}
@media screen and (max-width: 767px) {
#care .btn-contact {
font-size: 4vw;
}
}
@media screen and (max-width: 480px) {
#care .btn-contact {
font-size: 5.5vw;
}
}
#care header {
background: #eec9c5;
z-index: 10;
position: fixed;
padding: 1em 0;
}
#care header .container {
max-width: 1045px;
display: flex;
align-items: center;
justify-content: space-between;
}
.entry-body #care header h1 {
margin-bottom: 0;
}
#care header .navbar-brand img {
max-width: none;
max-height: 30px;
}
#care header .h-logo.plus img {
width: 240px;
}
#care ul.gMenu > li:not(:last-child) {
margin-right: 1em;
}
#care ul.gMenu > li:nth-last-child(2) > a,
#care ul.gMenu > li:last-child > a { border: none;
padding: 0 1.5em;
margin: 0;
border-radius: 2em;
background: #fbf4f3;
color: #000;
line-height: 3em;
display: flex;
justify-content: center;
align-items: center;
min-width: 10em;
}
#care ul.gMenu > li:nth-last-child(2) > a:hover,
#care ul.gMenu > li:last-child > a:hover {
background: #c00;
color: #fff;
opacity: 1;
}
#care .gMenu>li .gMenu_name {
position: relative;
padding-right: 1em;
font-weight: bold;
}
#care .gMenu>li .gMenu_name:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0.5em 0 0.5em 0.6em;
border-color: transparent transparent transparent #dd928c;
position: absolute;
top: calc(50% - 0.5em);
right: 0;
}
#care .gMenu>li a:hover .gMenu_name:after {
border-color: transparent transparent transparent #fff;
}
#care .mv {
position: relative;
background: #fff;
margin-top: 88px;
}
#care .mv .container {
max-width: 1050px;
position: relative;
padding: 100px 0 110px 0;
z-index: 3;
}
#care .mv:after {
content: none;
display: block; width: 125.6%; height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #fff;
bottom: -140px;
}
@media screen and (max-width: 1280px) {
#care .mv:after {
height: 54.7vw;
}
}
@media screen and (max-width: 767px) {
#care .mv:after {
height: 45.3vw;
}
}
@media screen and (max-width: 480px) {
#care header .h-logo.plus img {
width: 50vw;
}
}
#care .mv .mv_img {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 450px;
z-index: 0;
}
#care .mv .txt {
position: relative;
width: 595px;
z-index: 1; }
#care .mv h2 {
background: #2673B8;
color: #fff;
font-size: 27px;
padding: 0.5em;
margin-bottom: 60px;
line-height: 1.3;
font-weight: bold;
display: inline-block;
}
#care .mv h1 {
color: #b72d28;
font-size: 35px;
font-weight: bold;
line-height: 1.3;
margin-bottom: 10px;
padding-bottom: 10px;
display: inline-block;
text-align: left;
border-bottom: 3px solid #b72d28;
}
.entry-body #care .mv h1 span{
font-size: 22px;
letter-spacing: 0.2em;
}
#care .mv h1 img {
max-width: 85%;
}
#care .mv h1 + p{
color: #b72d28;
font-size: 28px;
text-align: center;
margin-bottom: 0.6em;
}
#care .mv .mv-btn-area {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
#care .mv .tel-area{
padding-left: 60px;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/care/icon_tel.png) left center no-repeat;
background-size: 50px auto;
margin-top: 25px;
}
#care .mv .tel-area p{
margin-bottom: 0;
font-size: 16px;
line-height: 1.2;
}
#care .mv .tel-area .tel{
font-size: 19px;
font-weight: bold;
}
@media screen and (max-width: 1090px) {
#care .mv .container {
padding: 5vw 0 7vw 0;
}
#care .mv:after {
bottom: -12.8vw;
}
#care .mv .mv_img { width: 40vw;
}
#care .mv .txt {
width: 54vw;
}
#care .mv h2 {
font-size: 2.5vw;
margin-bottom: 5.5vw;
}
#care .mv h1 {
font-size: 3.5vw;
margin-bottom: 2vw;
padding-bottom: 2vw;
}
#care .mv h1 + p {
font-size: 3vw;
margin-bottom: 0.5em;
}
}
@media screen and (max-width: 767px) {
#care .mv .container {
padding: 0;
}
#care .mv .mv_img {
position: relative;
right: auto;
top: auto;
width: 70%;
margin: 0 auto 5vw;
transform: translateY(0);
}
#care .mv .txt {
width: 82.4vw;
margin: 0 auto;
text-align: center;
}
#care .mv h2 {
font-size: 4.8vw;
margin-bottom: 12.0vw;
}
#care .mv h1 {
font-size: 5vw;
margin-bottom: 5vw;
display: inline-block;
text-align: center;
}
.entry-body #care .mv h1 span {
font-size: 5vw;
}
#care .mv h1 + p {
font-size: 4vw;
}
#care .mv .mv-btn-area {
margin-bottom: 5vw;
}
}
@media screen and (max-width: 480px) {
#care .mv h1 {
font-size: 6.5vw;
}
}
#care section {
position: relative;
padding: 100px 0;
}
#care .sec-ttl {
text-align: center;
position: relative;
font-size: 30px;
margin: 0 0 2em;
}
#care .sec-ttl h2 {
font-size: inherit;
font-weight: bold;
line-height: 1.3;
margin-bottom: 15px;
}
#care .sec-ttl p {
font-size: 20px;
line-height: 1.5;
margin-bottom: 0;
}
@media screen and (max-width: 985px) {
#care .sec-ttl {
font-size: 3.1vw;
}
#care .sec-ttl p {
font-size: 2.1vw;
}
#care .sec-ttl:after {
width: 8.3vw;
height: 0.6vw;
left: calc(50% - 4.1vw);
}
}
@media screen and (max-width: 767px) {
#care section {
padding: 12vw 0;
}
#care .sec-ttl {
font-size: 4.8vw;
margin-bottom: 5vw;
}
#care .sec-ttl p {
font-size: 3.2vw;
}
#care .sec-ttl:after {
width: 13.3vw;
height: 1.6vw;
left: calc(50% - 6.67vw);
}
}
@media screen and (max-width: 480px) {
#care .sec-ttl {
font-size: 5.5vw;
}
#care .sec-ttl p {
font-size: 4vw;
}
}
#care #sec-service {
background: #f9e5e5;  }
#care #sec-service:after {
content: none;
display: block; width: 125.6%; height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #f9e5e5;
bottom: -160px;
}
#care #sec-service h2 {
text-align: left;
font-size: 32px;
font-weight: bold;
display: flex;
flex-wrap: wrap;
align-items: center;
}
#care #sec-service h2 img {
max-width: 320px;
}
#care #sec-service .sec-ttl p {
font-size: 20px;
line-height: 1.9;
margin-bottom: 0;
text-align: left;
}
#care #sec-service .service-list-wrap {
text-align: center;
}
#care #sec-service .service-list-wrap h3{
font-size: 30px;
font-weight: 900;
line-height: 1.3;
background: linear-gradient(transparent 70%, #dd928c 70%);
margin: 0 auto 40px;
display: inline-block;
}
#care #sec-service .service-list {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
#care #sec-service .service-list > li {
width: 20%;
margin: 0 2.5%;
display: flex;
flex-wrap: wrap;
align-content: flex-start;
letter-spacing: normal;
}
#care #sec-service .service-list > li .r6-wrap {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
border: 3px dashed #878181;
border-radius: 50px;
padding: 20px;
margin-top: -23px;
position: relative;
}
#care #sec-service .service-list > li .r6-wrap::after {
content: "";
display: block;
position: absolute;
width: 3px;
height: 30px;
background: #878181;
bottom: -30px;
left: 50%;
}
#care #sec-service .service-list > li .photo {
position: relative;
width: 100%;
text-align: center;
}
#care #sec-service .service-list > li .r6-wrap .photo {
width: auto;
}
#care #sec-service .service-list > li .r6-wrap + p {
text-align: center;
margin-top: 40px;
color: #706b6b;
width: 100%;
FONT-SIZE: 20PX;
}
#care #sec-service .service-list > li img {
width: 140px;
max-width: 100%;
height: auto;
}
#care #sec-service .service-list > li h4 {
line-height: 1.3;
width: 100%;
text-align: center;
font-size: 21px;
font-weight: bold;
margin-top: 20px;
}
#care #sec-service .service-list > li ul {
width: auto;
font-size: 18px;
line-height: 1.3;
margin: 1.3em auto 0;
text-align: left;
}
#care #sec-service .service-list > li ul li {
width: auto;
line-height: 1.3;
text-indent: -1em;
}
@media screen and (max-width: 1280px) {
#care #sec-service:after {
height: 54.7vw;
}
#care #sec-service .service-list > li .r6-wrap {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
margin-top: 0;
}
#care #sec-service .service-list > li .r6-wrap .photo {
width: 25%;
}
}
@media screen and (max-width: 985px) {
#care #sec-service { }
#care #sec-service:after {
bottom: -16.5vw;
}
#care #sec-service .service-list > li h4 {
font-size: 2.9vw;
top: calc(50% - 1.9vw);
}
#care #sec-service .service-list > li ul {
font-size: 1.7vw;
}
}
@media screen and (max-width: 767px) {
#care #sec-service {
margin-top: 0; }
#care #sec-service:after {
height: 45.3vw;
}
#care #sec-service h2 {
text-align: center;
font-size: 6vw;
justify-content: center;
margin-bottom: 3vw;
}
#care #sec-service h2 img {
max-width: 70vw;
}
#care #sec-service .sec-ttl p {
font-size: 3.8vw;
line-height: 1.6;
}
#care #sec-service .service-list-wrap h3 {
font-size: 6vw;
margin-bottom: 5vw;
text-align: center;
}
#care #sec-service .service-list {
width: 73.3vw;
margin: 0 auto;
justify-content: center;
}
#care #sec-service .service-list > li {
width: 100%;
margin-bottom: 13.3vw;
}
#care #sec-service .service-list > li:last-child {
margin-top: 0;
margin-bottom: 0;
}
#care #sec-service .service-list > li .r6-wrap .photo {
width: 100%;
}
#care #sec-service .service-list > li .r6-wrap .photo + .photo {
margin-top: 2em;
}
#care #sec-service .service-list > li img { display: block;
margin: 0 auto;
}
#care #sec-service .service-list > li h4 {
font-size: 4vw;
}
#care #sec-service .service-list > li ul {
font-size: 3.2vw;
min-height: inherit;
}
}
@media screen and (max-width: 480px) {
#care #sec-service .service-list > li ul {
font-size: 4vw;
}
}
#care #sec-service2 { background: #fff;
}
#care #sec-service2 h2 {
font-size: 32px;
font-weight: bold;
}
#care #sec-service2 h2 span {
color: #b72d28;
}
#care #sec-service2 .service2-list {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
}
#care #sec-service2 .service2-list > li {
width: 20%;
display: flex;
flex-wrap: wrap;
align-content: flex-start;
}
#care #sec-service2 .service2-list > li .photo {
position: relative;
width: 100%;
text-align: center;
}
#care #sec-service2 .service2-list > li img {
width: 130px;
max-width: 100%;
height: auto;
}
#care #sec-service2 .service2-list > li h3 {
line-height: 1.3;
width: 100%;
text-align: center;
font-size: 22px;
font-weight: bold;
margin-top: 25px;
}
#care #sec-service2 .service2-list > li ul {
width: auto;
font-size: 17px;
line-height: 1.3;
margin: 1.3em auto 0;
}
#care #sec-service2 .service2-list > li ul li {
width: auto;
line-height: 1.3;
text-indent: -1em;
margin-left: 1em;
}
@media screen and (max-width: 985px) {
#care #sec-service2 { }
#care #sec-service2:after {
bottom: -16.5vw;
}
#care #sec-service2 .service2-list > li h3 {
font-size: 2.9vw;
}
#care #sec-service2 .service2-list > li ul {
font-size: 1.7vw;
}
}
@media screen and (max-width: 767px) {
#care #sec-service2 .service2-list > li {
width: 40%;
margin-bottom: 2em;
}
#care #sec-service2 .service2-list > li h3 {
font-size: 4vw;
}
#care #sec-service2 .service2-list > li ul {
font-size: 3.2vw;
}
}
@media screen and (max-width: 480px) {
#care #sec-service2 h2 {
font-size: 7vw;
}
}
#care #sec-feature-service { background: #fbf4f3;
}
#care #sec-feature-service:before {
content: none;
display: block;
width: 125.6%;
height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #fbf4f3;
top: -160px;
}
#care #sec-feature-service .container {
width: 95%; z-index: 3;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
#care #sec-feature-service .sec-ttl {
width: 100%;
margin: 0 0 0.5em;
}
#care #sec-feature-service h2 {
width: 100%;
}
#care #sec-feature-service h2 img {
width: 390px;
}
#care #sec-feature-service h2 span {
font-size: 36px;
font-weight: bold;
display: block;
}
#care #sec-feature-service .txt {
width: 595px;
z-index: 1;
}
#care #sec-feature-service .sec-feature-service_img {
width: 450px;
z-index: 0;
}
#care #sec-feature-service p {
font-size: 20px;
}
#care #sec-feature-service ul li {
font-size: 16px;
padding: 15px 10px;
}
#care #sec-feature-service ul li:not(:last-child) {
border-bottom: 1px solid #bb271a;
}
#care #sec-feature-service ul li span {
display: block;
font-size: 26px;
font-weight: bold;
color: #bb271a;
margin-top: 10px;
}
@media screen and (max-width: 1280px) {
#care #sec-feature-service:before {
height: 54.7vw;
}
#care #sec-feature-service .txt {
width: 52%;
}
#care #sec-feature-service .sec-feature-service_img {
width: 40%;
}
}
@media screen and (max-width: 985px) {
#care #sec-feature-service:before {
top: -16.5vw;
}
}
@media screen and (max-width: 767px) {
#care #sec-feature-service:before {
height: 45.3vw;
}
#care #sec-feature-service p {
font-size: 3.8vw;
}
#care #sec-feature-service .txt {
width: 100%;
}
#care #sec-feature-service .sec-feature-service_img {
width: 80%;
margin: 4vw auto 0;
}
#care #sec-feature-service ul li {
font-size: 3.8vw;
}
#care #sec-feature-service ul li span {
font-size: 1.6em;
}
}
@media screen and (max-width: 480px) {
#care #sec-feature-service h2 span {
font-size: 7vw;
}
}
#care #sec-feature-assistant { background: #e6e6e6;
}
#care #sec-feature-assistant:before {
content: none;
display: block;
width: 125.6%;
height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #e6e6e6;
top: -160px;
}
#care #sec-feature-assistant:after {
content: none;
display: block;
width: 125.6%;
height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #e6e6e6;
bottom: -160px;
z-index: 3;
}
#care #sec-feature-assistant .container {
width: 95%;
padding: 0 0 0 0;
z-index: 3;
display: flex;
flex-wrap: wrap;
flex-direction: row-reverse;
align-items: center;
justify-content: space-between;
z-index: 4;
}
#care #sec-feature-assistant .sec-ttl {
width: 100%;
}
#care #sec-feature-assistant h2 {
width: 100%;
}
#care #sec-feature-assistant h2 img {
width: 390px;
}
#care #sec-feature-assistant h2 span {
font-size: 32px;
font-weight: bold;
display: block;
}
#care #sec-feature-assistant .txt {
width: 633px;
}
#care #sec-feature-assistant .sec-feature-assistant_img {
width: 360px;
}
#care #sec-feature-assistant ul {
counter-reset: item;
}
#care #sec-feature-assistant ul li {
padding: 15px 0 15px 100px;
text-indent: 0;
counter-increment: li1;
position: relative;
}
#care #sec-feature-assistant ul li:before {
text-indent: 0;
background: #fff;
border-radius: 50%;
width: 70px;
height: 70px;
display: block;
content: "";
box-sizing: border-box;
position: absolute;
top: 50%;
left: 0;
transform: translate(0,-50%);
}
#care #sec-feature-assistant ul li:after {
color: #464747;
font-size: 32px;
font-weight: bold;
width: 70px;
height: 70px;
display: inline-block;
text-align: center;
line-height: 70px;
content: counter(li1);
box-sizing: border-box;
position: absolute;
top: 50%;
left: 0;
transform: translate(0,-50%);
}
#care #sec-feature-assistant ul li h3 {
font-size: 22px;
font-weight: bold;
line-height: 1.5;
}
#care #sec-feature-assistant ul li p {
font-size: 17px;
margin-bottom: 0;
line-height: 1.3;
}
@media screen and (max-width: 1280px) {
#care #sec-feature-assistant:before {
height: 54.7vw;
}
#care #sec-feature-assistant:after {
height: 54.7vw;
}
#care #sec-feature-assistant .txt {
width: 60%;
}
#care #sec-feature-assistant .sec-feature-assistant_img {
width: 32%;
}
#care #sec-feature-assistant ul li {
padding: 10px 0 10px 90px;
}
}
@media screen and (max-width: 985px) {
#care #sec-feature-assistant:before {
top: -16.5vw;
}
#care #sec-feature-assistant:after {
bottom: -16.5vw;
}
}
@media screen and (max-width: 767px) {
#care #sec-feature-assistant:before {
height: 45.3vw;
}
#care #sec-feature-assistant:after {
height: 45.3vw;
}
#care #sec-feature-assistant .txt {
width: 100%;
}
#care #sec-feature-assistant .sec-feature-assistant_img {
width: 60%;
margin: 4vw auto 0;
}
#care #sec-feature-assistant ul li h3 {
font-size: 5vw;
}
#care #sec-feature-assistant ul li p {
font-size: 4vw;
}
}
@media screen and (max-width: 480px) {
#care #sec-feature-assistant h2 span {
font-size: 7vw;
}
}
#care #sec-case { background: #eec9c5;
}
#care #sec-case:after {
content: none;
display: block;
width: 125.6%;
height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #eec9c5;
bottom: -160px;
}
#care #sec-case h2 {
width: 100%;
font-size: 36px;
font-weight: bold;
}
#care #sec-case ul {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
}
#care #sec-case ul li {
width: 100%;
max-width: 400px;
text-align: center;
}
#care #sec-case ul li a {
color: #000;
}
#care #sec-case ul li img {
width: 50%;
max-width: 290px;
border-radius: 50%;
}
#care #sec-case ul li h3 {
font-size: 18px;
font-weight: bold;
margin-top: 1em;
line-height: 1.6;
}
#care #sec-case ul li p {
font-size: 15px;
margin-top: 1em;
}
@media screen and (max-width: 1280px) {
#care #sec-case:after {
height: 54.7vw;
}
}
@media screen and (max-width: 985px) {
#care #sec-case:after {
bottom: -16.5vw;
}
}
@media screen and (max-width: 767px) {
#care #sec-case:after {
height: 45.3vw;
}
}
@media screen and (max-width: 480px) {
#care #sec-case h2 {
font-size: 7vw;
}
#care #sec-case ul li:not(:first-child) {
margin: 5vw auto 0;
}
}
#care #sec-message { background: #fff;
}
#care #sec-message:after {
content: none;
display: block;
width: 125.6%;
height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #fff;
bottom: -160px;
}
#care #sec-message h2 {
width: 100%;
font-size: 36px;
font-weight: bold;
}
#care #sec-message .container {
width: 95%;
padding: 0;
z-index: 3;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#care #sec-message .sec-ttl {
width: 100%;
}
#care #sec-message .txt {
width: 595px;
z-index: 1;
}
#care #sec-message p {
font-size: 14px;
}
#care #sec-message p:last-child {
font-size: 18px;
}
#care #sec-message .photo {
width: 450px;
z-index: 0;
}
@media screen and (max-width: 1280px) {
#care #sec-message:after {
height: 54.7vw;
}
#care #sec-message .txt {
width: 55%;
}
#care #sec-message .photo {
width: 37%;
}
}
@media screen and (max-width: 985px) {
#care #sec-message:after {
bottom: -16.5vw;
}
}
@media screen and (max-width: 767px) {
#care #sec-message:after {
height: 45.3vw;
}
#care #sec-message .txt {
width: 100%;
}
#care #sec-message .photo {
width: 80%;
margin: 4vw auto 0;
}
}
@media screen and (max-width: 480px) {
#care #sec-message h2 {
font-size: 7vw;
}
}
#care .cta {
position: relative;
}
#care .cta01 {
background: #2673B8;
padding: 320px 0 0;
margin: -160px 0 0;
}
#care .cta01:after {
content: "";
display: block;
width: 125.6%;
height: 700px;
border-radius: 50%;
position: absolute;
left: -12.8vw;
z-index: 2;
background: #2673B8;
bottom: -160px;
}
#care .cta01 .btn-contact{
position: relative;
top: 75px;
}
@media screen and (max-width: 1280px) {
#care .cta01:after {
height: 54.7vw;
}
}
@media screen and (max-width: 985px) {
#care .cta01 {
padding: 33.1vw 0 0;
margin: -16vw 0 0;
}
#care .cta01:after {
bottom: -16.5vw;
}
#care .cta01 .btn-contact{
top: 7vw;
}
}
@media screen and (max-width: 767px) {
#care .cta01:after {
height: 45.3vw;
}
}
#care .cta02 {
background: #fff;
padding: 220px 0;
}
@media screen and (max-width: 985px) {
#care .cta02 {
padding: 22vw 0;
}
}
#care #sec-contact {
background: #fbf4f3; }
@media screen and (max-width: 1280px) {
#care #sec-contact { }
#care #sec-contact:before {
height: 54.7vw;
}
}
@media screen and (max-width: 985px) {
#care #sec-contact:before {
top: -16.5vw;
}
}
@media screen and (max-width: 767px) {
#care #sec-contact:before {
height: 45.3vw;
}
}
#care .note_wrap {
background: #fbf4f3;
}
#care .note {
text-align: right;
}
#care .note a {
color: #ccc;
}
#care footer {
background: #eec9c5;
z-index: 4;
position: relative;
padding: 100px 0 10px;
text-align: center;
letter-spacing: normal;
}
#care footer .container{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#care footer .footer-col1 {
width: 175px;
display: flex;
flex-wrap: wrap;
align-items: center;
align-content: flex-start;
justify-content: center;
}
#care footer .footer-col1 p {
width: 100%;
border: 2px solid #000;
font-size: 18px;
margin-bottom: 20px;
line-height: 2;
}
#care footer .footer-logo {
width: auto;
display: block;
}
#care footer a.footer-logo span {
display: block;
color: #000;
font-size: 20px;
margin-top: 20px;
}
#care footer .footer-col2 {
width: 500px;
text-align: left;
}
#care footer .footer-col2 dl {
margin: 0;
}
#care footer .footer-col2 dl div {
display: flex;
flex-wrap: wrap;
}
#care footer .footer-col2 div dt {
width: 6em;
}
#care footer .footer-col2 div dd {
width: calc(100% - 6em);
}
#care footer .footer-col3 {
width: 280px;
text-align: left;
}
#care footer .footer-col3 dl {
margin: 0;
}
#care footer .footer-col3 dl div {
display: flex;
flex-wrap: wrap;
}
#care footer .footer-col3 div dt {
width: 60px;
padding-right: 10px;
}
#care footer .footer-col3 div dd {
width: calc(100% - 60px);
}
#care footer .copyright {
font-size: 16px;
text-align: center;
width: 100%;
margin: 20px auto 0;
}
@media screen and (max-width: 767px) {
#care footer {
padding: 10.3vw 0 8.3vw;
text-align: center;
}
#care footer .f-logo {
width: 31.0vw;
margin-bottom: 8.3vw;
}
#care footer .f-logo.plus{
width: 45vw;
}
#care footer .copyright {
font-size: 2.1vw;
}
}
@media screen and (max-width: 480px) {
#care footer .f-logo {
width: 38vw;
}
#care footer .f-logo.plus{
width: 50vw;
}
#care footer .copyright {
font-size: 2.8vw;
}
}
#care .app-btn {
display: inline-block;
margin: 0 auto;
padding: 1.5em 1em;
position: relative;
width: 340px;
font-size: 20px;
text-decoration: none;
border-radius: 0;
border: 2px solid #dd928c;
background: transparent;
color: #dd928c;
background: #fff;
transition: 0.3s all ease;
}
#care .app-btn-wrapper:hover .app-btn {
background: #dd928c;
color: #fff;
transform: scale(1.1);
}
@media screen and (max-width: 480px) {
#care .app-btn {
width: 100%;
}
}
#care .app-btn:after,
#care #sec-contact .app-btn-wrapper:after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 1em 0 1em 1.2em;
border-color: transparent transparent transparent #dd928c;
position: absolute;
top: calc(50% - 1em);
right: 1.2em;
}
#care #sec-contact .app-btn-wrapper:hover:after {
border-color: transparent transparent transparent #fbf4f3; }
#care #sec-contact .seminar-form-item {
display: flex;
flex-wrap: nowrap;
margin-bottom: 22px;
position: relative;
}
@media screen and (max-width: 480px) {
#care #sec-contact .seminar-form-item {
flex-wrap: wrap;
}
}
#care #sec-contact .seminar-form-item br {
display: none;
}
#care #sec-contact .seminar-form-item label,
#care #sec-contact th {
background: #dd928c;
width: 40%;
padding: 0.8em 2.5%;
font-size: 17px;
letter-spacing: 0.1em;
margin: 0;
font-weight: bold;
color: #fff;
}
@media screen and (max-width: 480px) {
#care #sec-contact .seminar-form-item label,
#care #sec-contact th {
width: 100%;
}
}
@media screen and (max-width: 767px) {
#care #sec-contact .seminar-form-item label,
#care #sec-contact th {
font-size: 15px;
letter-spacing: 0;
}
}
#care #sec-contact th {
vertical-align: top;
}
#care #sec-contact .seminar-form-item label .small,
#care #sec-contact th .small {
font-size: 14px;
font-weight: normal;
}
@media screen and (max-width: 767px) {
#care #sec-contact .seminar-form-item label .small,
#care #sec-contact th .small {
font-size: 13px;
}
}
#care #sec-contact .seminar-form-item .wpcf7-form-control-wrap {
width: 60%;
}
@media screen and (max-width: 480px) {
#care #sec-contact .seminar-form-item .wpcf7-form-control-wrap {
width: 100%;
}
}
#care #sec-contact .seminar-form-item input,
#care #sec-contact .seminar-form-item textarea,
#care #sec-contact .seminar-form-item select,
#care #sec-contact td {
border: 2px solid #dd928c;
border-radius: 0;
height: 100%;
box-shadow: none;
background: #fff;
}
@media screen and (max-width: 480px) {
#care #sec-contact .seminar-form-item input,
#care #sec-contact .seminar-form-item textarea,
#care #sec-contact .seminar-form-item select,
#care #sec-contact td {
padding: 0.8em;
}
}
#care #sec-contact td p {
margin-bottom: 0;
}
#care #sec-contact span.wpcf7-list-item {
display: block;
margin: 0;
line-height: 1.5;
}
@media screen and (max-width: 480px) {
#care #sec-contact span.wpcf7-list-item {
margin: 0;
}
}
#care .wpcf7 .privacy dl {
background: #fff;
border: 2px solid #dd928c;
}
#care #sec-contact .app-btn-outer {
margin: 100px 0 50px;
}
#care #sec-contact .app-btn-wrapper {
display: inline-block;
position: relative;
max-width: 340px;
width: 100%;
}
@media screen and (max-width: 480px) {
#care #sec-contact .app-btn-outer {
margin: 5vw 0;
}
}
 h3,h4 {
margin: 0;
padding: 0;
background: none;
} #hy_company .block01 h3{
color: #fff;
background: #cc0000;
font-size: 28px;
margin-bottom: 2em;
padding: 0.8em 3em 0.8em calc(50vw - 470px);
display: inline-block;
}
#hy_company .flex{
display: flex;
margin-bottom: 50px;
}
#hy_company .flex .item{
width:70%;
padding-right: 5%;
box-sizing: border-box;
}
#hy_company .flex .item dt{
color: #cc0000;
font-weight: bold;
}
#hy_company .flex .item dd{
border-bottom: dotted 2px #cc0000;
padding-bottom: 2%;
margin-bottom: 3%;
}
#hy_company .flex .video{
width:30%;
}
#hy_company .flex .video div{
width:100%;
height:150px;
margin: 5% 0;
}
#hy_company .com_info{
padding: 10vh 0;
margin-bottom: -40px;
position: relative;
}
#hy_company .com_info:before{ background: url(//help-you.me/wp1/wp-content/themes/hy/img/company/bg_cp03_2.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: '';
filter: brightness(50%);
z-index: -1;
}
#hy_company .com_info.adj{
margin-bottom: -50px; 
}
#hy_company table{
width: 60%;
color: #fff;
}
#hy_company table th,
#hy_company table td{
padding: 20px 0;
font-weight: 400;
border: none;
}
#hy_company table th{
width: 25%;
}
#hy_company table td a{
color: #fff;
}
#hy_company #block01 .bg-red {
right: 0;
background: linear-gradient(90deg,#fff 0%,#fff 20%,#cc0000 20%,#cc0000 100%);
padding: 150px calc(50vw - 440px) 150px 0;
margin-top: 22vh;
margin-right: calc(440px - 50vw);
text-align: center;
}
#hy_company #block01 p {
line-height: 2.2em;
}
#hy_top #block01 .block01_img{
text-align: center;
}
#hy_top #block01 .block01_img .bg-red img{
width: 285px;
}
#hy_company .mission{
text-align: center;
background: url(//help-you.me/wp1/wp-content/themes/hy/img/company/bg_mission.jpg);
background-position: 70% bottom;
background-repeat: no-repeat;
background-size: auto;
padding: 5% 0 8%;
}
#hy_company .vision{
text-align: center;
padding: 5% 0;
}
#hy_company .mission h3,
#hy_company .vision h3{
color: #cc0000;
font-size: 28px;
text-align: center;
font-weight: bold;
}
#hy_company .mission h4,
#hy_company .vision h4{
color: #cc0000;
font-size: 18px;
position: relative;
display: inline-block;
padding: 0 45px;
margin-bottom: 3em;
}
#hy_company .mission2 h3{
font-size: 24px;
color: #333333;
margin-bottom: 0.5em;
}
#hy_company .mission2 h3.ttl_vision{
margin-top: 1.8em;
}
#hy_company .mission2 h4{
color: #333333;
font-size: 30px;
font-weight: bold;
margin-bottom: 0;
}
#hy_company .mission h4:before,
#hy_company .mission h4:after,
#hy_company .vision h4:before,
#hy_company .vision h4:after{
content: '';
position: absolute;
top: 50%;
display: inline-block;
width: 35px;
height: 1px;
background-color: #cc0000;
}
#hy_company .mission2 h4:before,
#hy_company .mission2 h4:after{
background-color: #333333;
}
#hy_company .mission h4:before {left:0;}
#hy_company .mission h4:after {right: 0;}
#hy_company .vision h4:before {left:0;}
#hy_company .vision h4:after {right: 0;}
#hy_company .mission p,
#hy_company .vision p {
margin-top: 1em;
line-height: 1.8em;
}
@media screen and (max-width: 991px) {
#hy_company #block01 .bg-red {
padding: 100px calc(50vw - 325px) 100px 0;
margin-right: calc(325px - 50vw);
}
#hy_company .block01 h3 {
padding: 0.7em 3em 0.7em 1em;
}
}
@media screen and (max-width: 767px) {
#hy_company .flex{
display: block;
width: 90%;
margin: 0 auto 10%;
}
#hy_company .flex .item{
width:100%;
padding-right: 0;
box-sizing: border-box;
}
#hy_company .flex .video{
width: 80%;
margin: 0 auto;
}
#hy_company .com_info{
margin-bottom: -20px;
}
#hy_company .com_info.adj{
margin-bottom: -80px;
}
#hy_company table{
width: 90%;
}
#hy_company #block01 .col-md-12 {
margin-top: -40px;
}
#hy_company #block01 .bg-red {
padding: 30px 30px 30px 0;
margin-right: -30px;
margin-top: 0;
margin-bottom: 10%;
}
#hy_company #block01 .block01-2 {
position: relative;
top: 20%;
}
#hy_company .block01 h3 {
font-size: 20px;
}
#hy_company #block01 p {
line-height: 1.8em;
}
#hy_company .mission{
box-sizing: border-box;
padding: 8% 2% 25%;
}
#hy_company .vision{
box-sizing: border-box;
padding: 8% 2% 0;
}
#hy_company .mission h3,
#hy_company .vision h3{
font-size: 20px;
}
#hy_company .mission2 h3{
font-size: 17px;
}
#hy_company .mission2 h4{
font-size: 21px;
}
}
  #lp_cost-reduction {
color: #000;
font-size: 16px;
width: 100%;
} .lp_cost-reduction__heroWrap {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/main_img-scaled.jpg) bottom -5px right -40px no-repeat;
background-size: 100% auto;
height: 400px;
width: 940px;
margin: 0 auto;
}
.entry-body h1.lp_cost-reduction__hero {
color: #000;
margin-top: 0;
line-height: 1.4em;
}
.entry-body h1 div.lp_cost-reduction__hero__copyWrap {
width: 670px;
text-align: center;
}
.entry-body h1 div p.lp_cost-reduction__hero__mainCopy {
font-size: 28px;
margin-top: 0;
margin-bottom: 32px;
line-height: 0;
}
.entry-body h1 div p span.lp_cost-reduction__hero__mainCopy--emphasis {
display: inline-block;
color: #cc3300;
font-size: 28px;
line-height: 0;
}
.entry-body h1 div p.lp_cost-reduction__hero__subCopy {
font-size: 20px;
line-height: 1;
margin-bottom: 30px;
}
.entry-body h1 div p span.lp_cost-reduction__hero__subCopy--normal {
font-size: 20px;
display: inline-block;
font-weight: normal;
line-height: 1;
}
.entry-body h1 div p span.lp_cost-reduction__hero__subCopy--negative {
font-size: 20px;
display: inline-block;
color: #3366ff;
line-height: 1;
}
.entry-body h1 div p span.lp_cost-reduction__hero__subCopy--emphasis {
font-size: 20px;
display: inline-block;
color: #cc3300;
line-height: 1;
}
.entry-body div.lp_cost-reduction__heroPointWrap {
width: 100%;
margin: 0 auto;
background: #0e3e6f;
}
.entry-body div.lp_cost-reduction__heroPoint {
position: relative;
width: 550px;
color: #fff;
font-size: 20px;
line-height: 1.8;
text-align: center;
margin: 0 auto;
padding: 20px 0 20px 80px;
}
.entry-body div span.lp_cost-reduction__heroPoint--sub {
display: block;
font-size: 14px;
}
.entry-body div.lp_cost-reduction__heroPoint::before {
position: absolute;
left: 0;
top: 16px;
width: 70px;
height: 70px;
content: '';
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/main_img02.png) left center no-repeat;
background-size: contain;
} .lp_cost-reduction__btnWrap {
position: relative;
width: 400px;
height: 60px;
margin: 24px auto;
background: #cc3300;
font-size: 16px;
line-height: 60px;
}
.lp_cost-reduction__btnWrap--space {
margin: 64px auto 24px;
}
.lp_cost-reduction__btnWrap:after {
content: '';
width: 6px;
height: 6px;
border: 0px;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
top: 50%;
right: 30px;
margin-top: -4px;
}
.lp_cost-reduction__btnWrap:hover {
opacity: 60%;
}
.lp_cost-reduction__btn {
display: block;
color: #fff;
font-weight: normal;
}
.lp_cost-reduction__btn:hover {
color: #fff;
} .lp_cost-reduction__contentWrap {
text-align: center;
overflow: hidden;
}
.entry-body h1.lp_cost-reduction__heading {
color: #000;
font-size: 30px;
line-height: 1;
font-weight: normal;
padding-bottom: 30px;
}
.entry-body h1.lp_cost-reduction__heading--white {
color: #fff;
}
.lp_cost-reduction__lead {
}
.lp_cost-reduction__lead--white {
color: #fff;
} .lp_cost-reduction__sec01 {
padding: 60px 0;
}
.lp_cost-reduction__sec01__content {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.lp_cost-reduction__sec01__imgWrap {
width: 420px;
margin-right: 50px;
}
.lp_cost-reduction__sec01__img {
width: 100%;
}
.lp_cost-reduction__sec01__list {
width: 500px;
text-align: left;
padding-left: 0;
}
.lp_cost-reduction__sec01__list__item {
list-style-type: none;
line-height: 60px;
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec01_check.png)  left 0 top 20px  no-repeat;
background-size: 20px auto;
padding-left: 30px;
}
.lp_cost-reduction__sec01__list__item--emphasis {
font-weight: bold;
padding: 3px 0;
border-bottom: solid 1px #cc3300;
} .lp_cost-reduction__sec02 {
padding: 60px 0;
background: #cc3333;
}
.lp_cost-reduction__sec02__content {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.lp_cost-reduction__sec02__pointWrap {
width: 240px;
margin: 30px;
}
.lp_cost-reduction__sec02__point {
font-size: 20px;
}
.lp_cost-reduction__sec02__point--no {
font-size: 30px;
}
.lp_cost-reduction__sec02__point__ttl {
color: #fff;
font-weight: bold;
padding-bottom: 90px;
margin: 0;
}
.lp_cost-reduction__sec02__point__ttl--01 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec02_icon01.png)  center bottom 20px no-repeat;
background-size: 50px auto;
}
.lp_cost-reduction__sec02__point__ttl--02 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec02_icon02.png)  center bottom 20px no-repeat;
background-size: 50px auto;
}
.lp_cost-reduction__sec02__point__ttl--03 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec02_icon03.png)  center bottom 20px no-repeat;
background-size: 50px auto;
}
.lp_cost-reduction__sec02__point__txt {
color: #fff;
font-size: 12px;
line-height: 1.6;
margin: 0;
} .lp_cost-reduction__sec03 {
width: 100%;
padding: 60px 0;
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec02_backimg-scaled.jpg) center center no-repeat;
background-size: cover;
}
.lp_cost-reduction__sec03__content {
display: flex;
justify-content: center;
flex-wrap: wrap;
max-width: 940px;
margin: 0 auto;
}
.lp_cost-reduction__sec03__service {
width: 160px;
margin: 30px 14px;
}
.lp_cost-reduction__sec03__service__ttl {
color: #fff;
padding-top: 100px;
margin: 0 0 10px;
font-size: 12px;
font-weight: bold;
}
.lp_cost-reduction__sec03__service__ttl--no {
font-size: 20px;
font-weight: normal;
}
.lp_cost-reduction__sec03__service__ttl--01 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon01.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__ttl--02 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon02.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__ttl--03 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon03.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__ttl--04 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon04.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__ttl--05 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon05.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__ttl--06 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon06.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__ttl--07 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon07.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__ttl--08 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon08.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__ttl--09 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon09.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__ttl--10 {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec03_icon10.png)  center top no-repeat;
background-size: 90px auto;
}
.lp_cost-reduction__sec03__service__txt {
color: #fff;
font-size: 12px;
line-height: 1.6;
margin: 0;
} .lp_cost-reduction__sec04 {
padding: 60px 0;
}
.lp_cost-reduction__sec04__content {
display: flex;
justify-content: center;
flex-wrap: wrap;
max-width: 940px;
margin: 0 auto;
}
.lp_cost-reduction__sec04__imgWrap {
width: 100%;
margin: 0 auto;
}
.lp_cost-reduction__sec04__img {
width: 100%;
} .lp_cost-reduction__sec05 {
padding: 60px 0;
background: #fef2d3;
text-align: center;
}
.lp_cost-reduction__sec05__content {
display: flex;
flex-direction: column;
align-items: center;
flex-wrap: wrap;
max-width: 940px;
margin: 0 auto;
}
.lp_cost-reduction__sec05__headline {
width: 100%;
padding: 16px 0;
font-weight: bold;
border-top: 4px double #cc3333;
border-bottom: 4px double #cc3333;
}
.lp_cost-reduction__sec05__list {
text-align:left;
}
.lp_cost-reduction__sec05__list__item {
list-style-type: none;
line-height: 40px;
}
.lp_cost-reduction__sec05__list__item::before {
content:"■";
padding-right: 10px;
}
.lp_cost-reduction__sec05__list__item--emphasis {
color: #cc3300;
font-weight: bold;
}
.lp_cost-reduction__sec05__imgWrap {
width: 80%;
margin: 8px auto;
}
.lp_cost-reduction__sec05__img {
width: 100%;
}
.lp_cost-reduction__sec05__txt {
font-size: 12px;
} .lp_cost-reduction__sec06 {
padding: 60px 0;
background: #0e3e6f;
text-align: center;
}
.lp_cost-reduction__sec06__content {
display: flex;
justify-content: center;
flex-wrap: wrap;
color: #fff;
max-width: 980px;
margin: 0 auto;
}
.lp_cost-reduction__sec06__merit {
margin: 0 16px 16px 0;
width: 45%;
}
.lp_cost-reduction__sec06__merit--right {
border-left: 2px solid #052342;
padding-left: 16px;
margin-bottom: 16px;
}
.lp_cost-reduction__sec06__merit__ttl {
font-size: 12px;
font-weight: bold;
}
.lp_cost-reduction__sec06__merit__ttl--character {
display: block;
margin: 8px auto;
width: 140px;
height: 28px;
background: #fff;
border-radius: 14px;
font-size: 14px;
line-height: 28px;
font-weight: bold;
color: #0e3e6f;
}
.lp_cost-reduction__sec06__merit__lead {
font-size: 12px;
}
.lp_cost-reduction__sec06__merit__detail {
margin-bottom: 16px;
min-height: 150px;
border: 1px dashed #fff;
padding: 16px 16px 8px;
}
h3.lp_cost-reduction__sec06__merit__detail__ttl {
font-size: 14px;
font-weight: bold;
margin: 10px 0 20px 0;
}
.lp_cost-reduction__sec06__merit__detail__txt {
font-size: 12px;
text-align: left;
}
.lp_cost-reduction__sec06__message {
font-size: 20px;
} .lp_cost-reduction__sec07 {
padding: 60px 0;
background: #fef2d3;
text-align: center;
}
.lp_cost-reduction__sec07__content {
display: flex;
flex-direction: column;
align-items: center;
flex-wrap: wrap;
max-width: 940px;
margin: 0 auto;
}
.lp_cost-reduction__sec07__headline {
width: 100%;
padding: 16px 0;
font-weight: bold;
border-top: 4px double #cc3333;
border-bottom: 4px double #cc3333;
}
.lp_cost-reduction__sec07__headline--cap {
display: inline-block;
width: 140px;
height: 40px;
background: #cc3333;
border-radius: 20px;
color: #fff;
line-height: 40px;
margin-right: 20px;
}
.lp_cost-reduction__sec07__txtBold {
font-size: 16px;
font-weight: bold;
}
.lp_cost-reduction__sec07__txt {
line-height: 2;
font-size: 14px;
}
.lp_cost-reduction__sec07__txt--emphasis {
color: #cc3300;
font-weight: bold;
}
.lp_cost-reduction__sec07__imgWrap {
width: 80%;
margin: 24px auto;
}
.lp_cost-reduction__sec07__img {
width: 100%;
} .lp_cost-reduction__sec08 {
padding: 60px 0;
}
.lp_cost-reduction__sec08__content {
display: flex;
flex-direction: column;
align-items: center;
flex-wrap: wrap;
max-width: 940px;
margin: 0 auto;
text-align: left;
}
.lp_cost-reduction__sec08__lead {
text-align: center;
}
.lp_cost-reduction__sec08__tel {
color: #cc3333;
padding: 0 5px;
font-size: 24px;
}
.lp_cost-reduction__sec08 .seminar-form-item {
display: flex;
justify-content: center;
margin: 16px 0;
}
.lp_cost-reduction__sec08 label {
width: 200px;
height: 50px;
line-height: 50px;
background: #dfdfdf;
text-align:center;
}
.lp_cost-reduction__sec08 .form-control {
width: 400px;
height: 50px;
line-height: 50px;
font-size: 1rem;
font-weight: 400;
border-radius: 0;
color: #495057;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #dfdfdf;
}
.lp_cost-reduction__sec08 .privacy {
margin: 50px auto 20px;
}
.lp_cost-reduction__sec08__privacymark {
width: 80px;
height: 80px;
margin: 16px;
}
.lp_cost-reduction__sec08 .btn-primary {
width: 400px;
height: 60px;
font-size: 18px;
}
.lp_cost-reduction__sec08 .btn-primary:hover {
opacity: 60%;
}
@media screen and (max-width: 480px) {
* {
margin: 0;
padding: 0;
box-sizing: border-box;
} .lp_cost-reduction__heroWrap {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/main_img_sp.jpg) bottom -30px center no-repeat;
background-size: 100% auto;
height: 320px;
width:100%;
}
.entry-body h1 div.lp_cost-reduction__hero__copyWrap {
width: 100%;
padding: 0 20px;
}
.entry-body h1 div p.lp_cost-reduction__hero__mainCopy {
text-align: left;
font-size: 20px;
padding: 8px 0 0;
margin-bottom: 8px;
}
.entry-body h1 div p span.lp_cost-reduction__hero__mainCopy--emphasis {
font-size: 20px;
}
.entry-body h1 div p.lp_cost-reduction__hero__subCopy {
font-size: 14px;
line-height: 1.6;
text-align: left;
padding: 0 80px 0 0;
}
.entry-body h1 div p span.lp_cost-reduction__hero__subCopy--normal {
font-size: 14px;
line-height: 1.6;
}
.entry-body h1 div p span.lp_cost-reduction__hero__subCopy--negative {
font-size: 14px;
}
.entry-body h1 div p span.lp_cost-reduction__hero__subCopy--emphasis {
font-size: 14px;
}
.entry-body div.lp_cost-reduction__heroPoint {
position: static;
width: 100%;
font-size: 14px;
line-height: 1.6;
padding: 0 10px 10px;
font-weight: bold;
}
.entry-body div span.lp_cost-reduction__heroPoint--sub {
display: block;
font-size: 12px;
font-weight: normal;
}
.entry-body div.lp_cost-reduction__heroPoint::before {
display: block;
position: static;
left: 0;
top: 0;
width: 100%;
height: 60px;
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/main_img02.png) center top 10px no-repeat;
background-size: 40px auto;
} .lp_cost-reduction__btnWrap {
margin-top: 130px;
width: 95%;
font-size: 14px;
}
.lp_cost-reduction__btnWrap--space {
margin: 16px auto;
} .entry-body h1.lp_cost-reduction__heading {
font-size: 18px;
}
.lp_cost-reduction__lead {
font-size: 12px;
} .lp_cost-reduction__sec01__imgWrap {
padding: 10px;
width: 100%;
margin: 0;
}
.lp_cost-reduction__sec01__list {
width: 100%;
}
.lp_cost-reduction__sec01__list__item {
background: url(https://help-you.me/wp1/wp-content/uploads/2020/05/sec01_check.png)  left 10px top 12px  no-repeat;
background-size: 14px auto;
line-height: 1.4;
padding: 10px 10px 10px 30px;
font-size: 12px;
} .lp_cost-reduction__sec02__pointWrap {
margin: 10px;
}
.lp_cost-reduction__sec02__point__ttl {
padding-bottom: 80px;
}
.lp_cost-reduction__sec02__point__txt {
margin: -10px 0 0 0;
} .lp_cost-reduction__sec03__service {
width: 145px;
margin: 20px 10px;
} .lp_cost-reduction__sec04 {
padding: 60px 10px;
} .lp_cost-reduction__sec05 {
padding: 60px 10px;
}
.lp_cost-reduction__sec05__headline {
font-size: 14px;
padding: 8px;
text-align: left;
line-height: 1.6;
}
.lp_cost-reduction__sec05__list {
margin: 10px 10px 10px 30px;
}
.lp_cost-reduction__sec05__list__item {
font-size: 12px;
line-height: 1.4;
padding: 5px;
}
.lp_cost-reduction__sec05__list__item::before {
margin-left: -24px;
}
.lp_cost-reduction__sec05__imgWrap {
width: 100%;
}
.lp_cost-reduction__sec05__txt {
text-align:left;
} .lp_cost-reduction__sec06 {
padding: 60px 10px;
}
.lp_cost-reduction__sec06__merit {
width: 100%;
margin: 0 0 16px 0;
}
.lp_cost-reduction__sec06__merit--right {
border-left: none;
padding-left: 0;
}
.lp_cost-reduction__sec06__message {
font-size: 16px;
} .lp_cost-reduction__sec07 {
padding: 60px 10px;
}
.lp_cost-reduction__sec07__headline {
font-size: 14px;
padding: 8px;
line-height: 1.6;
}
.lp_cost-reduction__sec07__headline--cap {
display: block;
margin: 0 auto 10px;
height: 30px;
border-radius: 15px;
line-height: 30px;
}
.lp_cost-reduction__sec07__txtBold {
font-size: 14px;
margin-top: 10px;
}
.lp_cost-reduction__sec07__txt {
line-height: 1.6;
font-size: 12px;
text-align:left;
}
.lp_cost-reduction__sec07__imgWrap {
width: 100%;
} .lp_cost-reduction__sec08__content .wpcf7{
width: 100%;
padding: 0 10px;
}
.lp_cost-reduction__sec08 .seminar-form-item {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.lp_cost-reduction__sec08 label {
margin-bottom: 0;
width: 100%;
}
.wpcf7-form-control-wrap {
width: 100%;
}
.lp_cost-reduction__sec08 .form-control {
width: 100%;
}
.lp_cost-reduction__sec08 .btn-primary {
max-width: 100%;
}
}

.mainSection {
margin-bottom: 0 !important;
}
.siteContent {
padding: 0 !important;
}
.hy_2023 {
font-family: "Noto Sans JP", sans-serif;
color: #5E5B55;
margin-top: 45px;
}
.hy_2023 .h1 {
text-align: center;
margin-bottom: 0.5em;
font-size: 20px;
line-height: 1.7;
letter-spacing: 0.12em;
}
.hy_2023 h2,
.hy_2023 .h2 {
text-align: center;
margin-bottom: 1.1em;
font-size: 20px;
line-height: 1.3;
letter-spacing: 0.12em;
}
.hy_2023 section {
padding: 30px 0;
}
.hy_2023 section > h2[id] {
padding-top: 75px;
margin-top: -75px;
}
.hy_2023 .container {
padding: 0 20px;
max-width: 906px;
}
.hy_2023 .btn_container {
text-align: center;
}
.hy_2023 .btn {
padding: 0;
}
.hy_2023 .btn a {
position: relative;
display: block;
min-width: 17.5em;
padding: 1.5em 2.5em 1.5em 2em;
background-color: #CB0000;
color: #ffffff;
border-radius: 100px;
font-size: 16px;
letter-spacing: 0.15em;
line-height: 1;
}
.hy_2023 .btn a:hover {
text-decoration: none;
}
.hy_2023 .btn a::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
right: 1.5em;
margin: auto;
display: block;
width: 0.7em;
height: 0.7em;
border-right: 1px solid #ffffff;
border-bottom: 1px solid #ffffff;
transform: rotate(-45deg);
}
.hy_2023 .sp-only {
display: block;
}
.hy_2023 .pc-only {
display: none;
}
@media screen and (min-width: 768px) {
.hy_2023 .sp-only {
display: none;
}
.hy_2023 .pc-only {
display: block;
}
}
@media screen and (min-width: 992px) {
.hy_2023 {
margin-top: 68px;
}
.hy_2023 .h1 {
font-size: 35px;
line-height: 1;
}
.hy_2023 h2,
.hy_2023 .h2 {
font-size: 31px;
}
.hy_2023 section {
padding: 40px 0;
}
.hy_2023 section > h2[id] {
padding-top: 125px;
margin-top: -125px;
}
.hy_2023 .btn_container {
margin-top: 20px;
}
}
@media screen and (min-width: 1200px) {
.hy_2023 {
margin-top: 85px;
}
}
.hy_2023 .section_about .txtblock h2 {
font-size: 24px;
line-height: 1.3;
margin-bottom: 0.5em;
}
.hy_2023 .section_about + .section_reason {
margin-top: -30px;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_about .container {
position: relative;
margin-top: 10px;
}
.hy_2023 .section_about .txtblock {
position: absolute;
top: 10px;
left: 30px;
width: 54%;
}
.hy_2023 .section_about .txtblock h2 {
margin-bottom: 15px;
text-align: left;
}
.hy_2023 .section_about .txtblock p {
line-height: 1.6;
letter-spacing: 0.1em;
}
}
@media screen and (min-width: 992px) {
.hy_2023 .section_about .txtblock h2 {
font-size: 31px;
}
.hy_2023 .section_about .txtblock p {
font-size: 17px;
}
}
.hy_2023 .section_assistant .container > .txtblock {
margin-bottom: 45px;
}
.hy_2023 .section_assistant .container > .txtblock h3 {
font-size: 20px;
text-align: center;
}
.hy_2023 .section_assistant .container > .txtblock ul {
margin-top: 15px;
}
.hy_2023 .section_assistant .container > .txtblock ul li {
margin-left: 1.5em;
}
.hy_2023 .section_assistant .container > .txtblock ul li::before {
content: "✓";
margin-right: 0.5em;
}
.hy_2023 .section_assistant .container > .txtblock ul li::first-letter {
margin-left: -1.5em;
}
.hy_2023 .section_assistant .voice {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 15px;
padding: 15px;
background-color: #F3EFE9;
border-radius: 100px;
}
.hy_2023 .section_assistant .voice .imgblock {
width: 75px;
}
.hy_2023 .section_assistant .voice .txtblock {
width: calc(100% - 90px);
}
.hy_2023 .section_assistant .voice .txtblock p {
margin-bottom: 0;
font-size: 14px;
line-height: 1.2;
}
.hy_2023 .section_assistant .voice .txtblock p span {
font-size: 16px;
line-height: 1.5;
}
.hy_2023 .section_assistant .steps {
margin: 40px 0;
}
.hy_2023 .section_assistant .assistant {
margin: 40px 0 0;
}
.hy_2023 .section_assistant .assistant h4 {
font-size: 20px;
text-align: center;
margin-bottom: 15px;
}
.hy_2023 .section_assistant .assistant .txtblock {
text-align: center;
}
.hy_2023 .section_assistant .assistant .txtblock .inner {
display: inline-block;
text-align: left;
}
.hy_2023 .section_assistant .assistant .txtblock .inner ul li {
margin-left: 1.5em;
font-size: 15px;
}
.hy_2023 .section_assistant .assistant .txtblock .inner ul li::before {
content: "●";
margin-right: 0.5em;
}
.hy_2023 .section_assistant .assistant .txtblock .inner ul li::first-letter {
margin-left: -1.5em;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_assistant .container {
position: relative;
margin: 0 auto;
padding: 30px 0 0;
}
.hy_2023 .section_assistant .container > .txtblock {
position: absolute;
top: 0;
left: 16px;
margin-bottom: 0;
width: 45%;
}
.hy_2023 .section_assistant .container > .txtblock h3 {
letter-spacing: 0.12em;
text-align: left;
}
.hy_2023 .section_assistant .container > .txtblock ul {
margin-top: 10px;
}
.hy_2023 .section_assistant .container > .txtblock ul li {
font-size: 14px;
line-height: 1.5;
}
.hy_2023 .section_assistant .voice {
position: absolute;
margin-top: 0;
padding: 7px 15px;
width: 300px;
}
.hy_2023 .section_assistant .voice .imgblock {
width: 50px;
}
.hy_2023 .section_assistant .voice .txtblock {
width: calc(100% - 60px);
}
.hy_2023 .section_assistant .voice .txtblock p {
font-size: 12px;
line-height: 1.1;
}
.hy_2023 .section_assistant .voice .txtblock p span {
font-size: 12px;
line-height: 1.1;
}
.hy_2023 .section_assistant .voice.voice_01 {
width: 270px;
top: 110px;
left: 8px;
}
.hy_2023 .section_assistant .voice.voice_02 {
top: 0;
right: 12px;
}
.hy_2023 .section_assistant .steps {
margin: 0 -10px;
}
.hy_2023 .section_assistant .assistant {
position: absolute;
right: 0;
bottom: 10px;
margin: 0;
}
.hy_2023 .section_assistant .assistant h4 {
font-size: 15px;
letter-spacing: 0.12em;
text-align: left;
margin-bottom: 10px;
}
.hy_2023 .section_assistant .assistant .txtblock {
text-align: left;
}
.hy_2023 .section_assistant .assistant .txtblock .inner {
display: flex;
text-align: left;
}
.hy_2023 .section_assistant .assistant .txtblock .inner ul {
margin: 0 5px;
}
.hy_2023 .section_assistant .assistant .txtblock .inner ul li {
font-size: 11px;
line-height: 1.3;
}
}
@media screen and (min-width: 992px) {
.hy_2023 .section_assistant .container > .txtblock h3 {
font-size: 23px;
}
.hy_2023 .section_assistant .voice .imgblock {
width: 50px;
}
.hy_2023 .section_assistant .voice .txtblock {
top: 20px;
width: calc(100% - 60px);
}
.hy_2023 .section_assistant .voice .txtblock p {
font-size: 12px;
}
.hy_2023 .section_assistant .voice .txtblock p span {
font-size: 12px;
}
.hy_2023 .section_assistant .voice.voice_01 {
width: 300px;
top: 150px;
left: 0;
}
.hy_2023 .section_assistant .voice.voice_02 {
top: 5px;
}
.hy_2023 .section_assistant .assistant .txtblock .inner ul li {
font-size: 12px;
line-height: 1.4;
}
}
.hy_2023 .section_case .case_list li {
margin-bottom: 20px;
}
.hy_2023 .section_case .case_list li a,
.hy_2023 .section_case .case_list li span {
display: block;
height: 100%;
color: #5E5B55;
border: 1px solid #DBD8D2;
}
.hy_2023 .section_case .case_list li a:hover,
.hy_2023 .section_case .case_list li span:hover {
text-decoration: none;
}
.hy_2023 .section_case .case_list li .imgblock img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: 50% 0%;
object-position: 50% 0%;
aspect-ratio: 300/175;
}
.hy_2023 .section_case .case_list li .txtblock {
padding: 15px;
}
.hy_2023 .section_case .case_list li .txtblock h3 {
margin: 0.2em 0 0.7em;
font-size: 15px;
font-weight: 700;
line-height: 1.3;
}
.hy_2023 .section_case .case_list li .txtblock p {
line-height: 1.5;
margin-bottom: 0;
}
.hy_2023 .section_case .case_list li.comingsoon {
display: none;
}
.hy_2023 .section_case.bg {
background-color: #F3EFE9;
}
.hy_2023 .section_case.bg .case_list li a {
background-color: #ffffff;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_case .case_list {
display: flex;
flex-wrap: wrap;
margin: 0 -12px -24px;
}
.hy_2023 .section_case .case_list li {
width: calc(33.333% - 24px);
margin: 0 12px 24px;
}
.hy_2023 .section_case .case_list li .txtblock p {
font-size: 13px;
}
.hy_2023 .section_case .case_list li.comingsoon {
display: block;
}
.hy_2023 .section_case .btn_container {
margin-top: 40px;
}
}
.hy_2023 .section_downloads .downloads_list li {
margin-bottom: 20px;
}
.hy_2023 .section_downloads .downloads_list li a {
display: block;
height: 100%;
color: #5E5B55;
}
.hy_2023 .section_downloads .downloads_list li a:hover {
text-decoration: none;
}
.hy_2023 .section_downloads .downloads_list li .imgblock img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: 50% 0%;
object-position: 50% 0%;
aspect-ratio: 16/9;
}
.hy_2023 .section_downloads .downloads_list li .txtblock {
padding: 15px;
text-align: center;
}
.hy_2023 .section_downloads .downloads_list li .txtblock h3 {
text-align: center;
margin: 0.5em 0 1.2em;
font-size: 16px;
font-weight: 700;
line-height: 1.3;
}
.hy_2023 .section_downloads .downloads_list li .txtblock .btn {
position: relative;
display: inline-block;
min-width: 13.5em;
padding: 0.7em 2.75em 0.7em 1.25em;
color: #5E5B55;
background-color: #F3EFE9;
border-radius: 100px;
letter-spacing: 0.07em;
line-height: 1;
}
.hy_2023 .section_downloads .downloads_list li .txtblock .btn::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
right: 1.25em;
margin: auto;
display: block;
width: 1.2em;
height: 1.2em;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_download_black.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.hy_2023 .section_downloads.bg {
background-color: #F3EFE9;
}
.hy_2023 .section_downloads.bg .downloads_list li .txtblock .btn {
color: #5E5B55;
background-color: #ffffff;
border: 1px solid #DBD8D2;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_downloads .downloads_list {
display: flex;
flex-wrap: wrap;
margin: 0 -12px -24px;
}
.hy_2023 .section_downloads .downloads_list li {
width: calc(33.333% - 24px);
margin: 0 12px 24px;
}
}
.hy_2023 .section_seminars .seminars_list li {
margin-bottom: 20px;
}
.hy_2023 .section_seminars .seminars_list li a {
display: block;
height: 100%;
color: #5E5B55;
}
.hy_2023 .section_seminars .seminars_list li a:hover {
text-decoration: none;
}
.hy_2023 .section_seminars .seminars_list li .imgblock img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: 50% 0%;
object-position: 50% 0%;
aspect-ratio: 16/9;
}
.hy_2023 .section_seminars .seminars_list li .txtblock {
padding: 15px;
text-align: center;
}
.hy_2023 .section_seminars .seminars_list li .txtblock h4 {
display: inline-block;
margin-bottom: 5px;
padding: 5px 15px;
border-radius: 3px;
font-size: 13px;
font-weight: 600;
line-height: 1;
}
.hy_2023 .section_seminars .seminars_list li .txtblock h4.open {
background-color: #CB0000 !important;
border: 1px solid #CB0000;
color: #ffffff;
}
.hy_2023 .section_seminars .seminars_list li .txtblock h4.closed {
background-color: #ffffff !important;
border: 1px solid #CB0000;
color: #CB0000;
}
.hy_2023 .section_seminars .seminars_list li .txtblock h4.archive {
background-color: #111 !important;
border: 1px solid #111;
color: #ffffff;
}
.hy_2023 .section_seminars .seminars_list li .txtblock h3 {
text-align: center;
margin: 0.5em 0 1.2em;
font-size: 16px;
font-weight: 700;
line-height: 1.3;
}
.hy_2023 .section_seminars .seminars_list li .txtblock .btn {
position: relative;
display: inline-block;
min-width: 13.5em;
padding: 0.7em 1.25em;
color: #5E5B55;
background-color: #F3EFE9;
border-radius: 100px;
letter-spacing: 0.07em;
line-height: 1;
}
.hy_2023 .section_seminars.bg {
background-color: #F3EFE9;
}
.hy_2023 .section_seminars.bg .seminars_list li .txtblock .btn {
color: #5E5B55;
background-color: #ffffff;
border: 1px solid #DBD8D2;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_seminars .seminars_list {
display: flex;
flex-wrap: wrap;
margin: 0 -12px -24px;
}
.hy_2023 .section_seminars .seminars_list li {
width: calc(33.333% - 24px);
margin: 0 12px 24px;
}
}
.hy_2023 .section_faq {
background-color: #ffffff;
}
.hy_2023 .section_faq .container {
max-width: 720px;
}
.hy_2023 .section_faq .faq_accordion {
padding-bottom: 1px;
background-color: #ffffff;
border-bottom: 1px solid rgb(218.9106145251, 217.6368715084, 215.0893854749);
}
.hy_2023 .section_faq .faq_accordion_item {
display: none;
}
.hy_2023 .section_faq .q_sign {
color: #CB0000;
margin-right: 0.5em;
font-weight: 700;
font-size: larger;
}
.hy_2023 .section_faq .faq_question {
display: block;
padding: 0.8em 30px 0.8em 2.3em;
cursor: pointer;
position: relative;
font-size: 14px;
font-weight: 700;
border-top: 1px solid rgb(218.9106145251, 217.6368715084, 215.0893854749);
margin: 0;
text-indent: -1.5em;
}
.hy_2023 .section_faq .faq_question::before, .hy_2023 .section_faq .faq_question::after {
content: "";
width: 14px;
height: 2px;
background: #5E5B55;
position: absolute;
top: 50%;
right: 15px;
transform: translateY(-50%);
}
.hy_2023 .section_faq .faq_question::after {
transform: translateY(-50%) rotate(90deg);
transition: 0.3s ease all;
}
.hy_2023 .section_faq .faq_accordion_item:checked + .faq_question:after {
transform: translateY(-50%) rotate(0);
}
.hy_2023 .section_faq .faq_answer {
display: block;
height: 0;
overflow: hidden;
padding: 0;
opacity: 0;
transition: 0.5s;
font-weight: normal;
margin: 0;
}
.hy_2023 .section_faq .faq_accordion_item:checked + .faq_question + .faq_answer {
height: auto;
opacity: 1;
padding: 0.7em;
background: #F9E5E6;
font-size: 14px;
line-height: 1.8;
margin: 0 10px 1em 10px;
}
.hy_2023 .section_feature h2 {
font-size: 18px;
font-weight: 700;
line-height: 1.5;
}
.hy_2023 .section_feature .feature_list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.hy_2023 .section_feature .feature_list li {
width: calc(50% - 10px);
margin-top: 20px;
padding: 12px 10px;
border: 3px solid #CB0000;
border-radius: 7px;
}
.hy_2023 .section_feature .feature_list li:nth-child(1), .hy_2023 .section_feature .feature_list li:nth-child(2) {
margin-top: 0;
}
.hy_2023 .section_feature .feature_list li .num {
margin-bottom: 7px;
text-align: center;
font-size: 16px;
font-weight: 900;
line-height: 1;
color: #CB0000;
}
.hy_2023 .section_feature .feature_list li h3 {
text-align: center;
font-size: 16px;
font-weight: 700;
line-height: 1.5;
}
.hy_2023 .section_feature .feature_list li .imgblock {
display: flex;
align-items: center;
justify-content: center;
width: 80%;
margin: 10px auto;
aspect-ratio: 200/150;
}
.hy_2023 .section_feature .feature_list li .txtblock p {
margin: 0;
font-size: 12px;
line-height: 1.4;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_feature h2 {
margin-bottom: 35px;
font-size: 23px;
line-height: 1.3;
letter-spacing: 0.2em;
}
.hy_2023 .section_feature .feature_list li {
width: calc(25% - 10px);
margin-top: 0;
padding: 12px 17px 20px;
border-width: 4px;
}
.hy_2023 .section_feature .feature_list li .num {
margin-bottom: 7px;
font-size: 28px;
}
.hy_2023 .section_feature .feature_list li h3 {
font-size: 17px;
}
.hy_2023 .section_feature .feature_list li .imgblock {
width: 100%;
margin: 5px auto;
}
.hy_2023 .section_feature .feature_list li .txtblock p {
font-size: 14px;
}
}
.hy_2023 .section_reason h3 {
position: relative;
font-size: 18px;
line-height: 1.3;
text-align: center;
}
.hy_2023 .section_reason h3::before, .hy_2023 .section_reason h3::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
margin: auto;
display: block;
width: calc(53% - 8em);
height: 0;
border-top: 3px solid #DBD8D2;
}
.hy_2023 .section_reason h3::before {
left: 0;
}
.hy_2023 .section_reason h3::after {
right: 0;
}
.hy_2023 .section_reason .reason_list li {
margin-top: 35px;
padding: 12px 10px;
border: 4px solid #F3EFE9;
border-radius: 7px;
}
.hy_2023 .section_reason .reason_list li h4 {
text-align: center;
font-size: 20px;
font-weight: 700;
line-height: 1.5;
}
.hy_2023 .section_reason .reason_list li h4 span {
display: inline-block;
font-size: 28px;
font-style: italic;
background: linear-gradient(transparent 70%, #B3D2D8 0);
}
.hy_2023 .section_reason .reason_list li .imgblock {
width: 80%;
margin: 15px auto;
}
.hy_2023 .section_reason .reason_list li .txtblock p {
margin: 0 10px;
font-size: 16px;
line-height: 1.4;
}
.hy_2023 .section_reason + .section_assistant {
margin-top: -30px;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_reason h3 {
font-size: 25px;
letter-spacing: 0.12em;
}
.hy_2023 .section_reason h3::before, .hy_2023 .section_reason h3::after {
width: calc(58% - 13.5em);
}
.hy_2023 .section_reason h3::before {
left: -50px;
}
.hy_2023 .section_reason h3::after {
right: -50px;
}
.hy_2023 .section_reason .reason_list {
display: flex;
justify-content: space-between;
}
.hy_2023 .section_reason .reason_list li {
width: calc(33.33% - 18px);
margin-top: 35px;
padding: 20px 10px;
}
.hy_2023 .section_reason .reason_list li h4 {
font-size: 15px;
}
.hy_2023 .section_reason .reason_list li h4 span {
font-size: 24px;
line-height: 1.2;
}
.hy_2023 .section_reason .reason_list li .imgblock {
width: 93%;
margin: 15px auto 5px;
}
.hy_2023 .section_reason .reason_list li .txtblock p {
font-size: 14px;
}
}
.hy_2023 .section_service {
background-color: #F3EFE9;
}
.hy_2023 .section_service .service_list li {
margin-top: 20px;
}
.hy_2023 .section_service .service_list li:first-child {
margin-top: 0;
}
.hy_2023 .section_service .service_list li a {
display: flex;
justify-content: space-between;
align-items: center;
height: 100%;
color: #5E5B55;
}
.hy_2023 .section_service .service_list li a:hover {
text-decoration: none;
}
.hy_2023 .section_service .service_list li .imgblock {
width: calc(25% - 5px);
}
.hy_2023 .section_service .service_list li .txtblock {
background-color: #ffffff;
width: calc(75% - 5px);
}
.hy_2023 .section_service .service_list li .txtblock h3 {
padding: 0.5em;
font-size: 14px;
font-weight: 700;
text-align: center;
}
.hy_2023 .section_service .service_list li .txtblock h3.color-01 {
background-color: #C7BCCD;
}
.hy_2023 .section_service .service_list li .txtblock h3.color-02 {
background-color: #F0BA8D;
}
.hy_2023 .section_service .service_list li .txtblock h3.color-03 {
background-color: #C0B7A5;
}
.hy_2023 .section_service .service_list li .txtblock h3.color-04 {
background-color: #A3BCCA;
}
.hy_2023 .section_service .service_list li .txtblock h3.color-05 {
background-color: #B3CAC7;
}
.hy_2023 .section_service .service_list li .txtblock h3.color-06 {
background-color: #F0E5B6;
}
.hy_2023 .section_service .service_list li .txtblock h3.color-07 {
background-color: #EBC8C7;
}
.hy_2023 .section_service .service_list li .txtblock h3.color-08 {
background-color: #B6C3DC;
}
.hy_2023 .section_service .service_list li .txtblock .text {
padding: 10px;
}
.hy_2023 .section_service .service_list li .txtblock p {
margin: 0;
font-size: 12px;
line-height: 1.4;
}
.hy_2023 .section_service .service_list li .txtblock p.more {
margin-top: 10px;
font-weight: 700;
text-decoration: underline;
}
.hy_2023 .section_service .service_list + div {
margin-top: 30px;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_service .service_list {
display: flex;
flex-wrap: wrap;
margin: 0 -12px 20px;
}
.hy_2023 .section_service .service_list li {
width: calc(25% - 24px);
margin: 24px 12px 0;
}
.hy_2023 .section_service .service_list li:nth-child(1), .hy_2023 .section_service .service_list li:nth-child(2), .hy_2023 .section_service .service_list li:nth-child(3), .hy_2023 .section_service .service_list li:nth-child(4) {
margin-top: 0;
}
.hy_2023 .section_service .service_list li a {
flex-direction: column;
}
.hy_2023 .section_service .service_list li .imgblock {
width: 65%;
margin: 0 auto 15px;
}
.hy_2023 .section_service .service_list li .txtblock {
width: 100%;
flex-grow: 1;
}
.hy_2023 .section_service .service_list li .txtblock h3 {
font-size: 16.5px;
}
.hy_2023 .section_service .service_list li .txtblock .text {
padding: 10px 18px;
}
.hy_2023 .section_service .service_list li .txtblock p {
font-size: 13px;
letter-spacing: 0.04em;
}
}
.hy_2023 .section_keyvisual {
padding: 30px 0 0;
background-color: #CB0000;
}
.hy_2023 .section_keyvisual .container {
position: relative;
padding: 0;
width: 100%;
max-width: none;
}
.hy_2023 .section_keyvisual .container .txtblock {
margin: -1px 0 0;
padding: 5px 0 20px;
background-color: #ffffff;
}
.hy_2023 .section_keyvisual .container .txtblock .logo_10th {
width: 25%;
max-width: 150px;
margin: 0 auto 1%;
}
.hy_2023 .section_keyvisual .container .txtblock h1 {
width: 55%;
max-width: 414px;
margin: 0 auto 3%;
}
.hy_2023 .section_keyvisual .container .txtblock h2 {
width: 73%;
max-width: 550px;
margin: 0 auto 3%;
}
.hy_2023 .section_keyvisual .container .txtblock .btn_container {
margin: 0 auto;
padding: 0 14%;
}
.hy_2023 .section_keyvisual .container .txtblock .btn_container .btn {
margin: 10px 0 0;
}
.hy_2023 .section_keyvisual .container .txtblock .btn_container .btn a {
min-width: 14em;
padding: 0.8em 1em;
font-weight: 700;
}
.hy_2023 .section_keyvisual .container .txtblock .btn_container .btn a::after {
content: none;
}
.hy_2023 .section_keyvisual .container .txtblock .tel {
margin: 10px 0 0;
text-align: center;
}
.hy_2023 .section_keyvisual .container .txtblock .tel a {
display: inline-block;
padding-left: 22px;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_tel_red.svg);
background-repeat: no-repeat;
background-position: 0 0;
background-size: 16px auto;
line-height: 1;
}
.hy_2023 .section_keyvisual .container .txtblock .tel a span {
font-size: 10px;
}
.hy_2023 .section_keyvisual .container .txtblock .tel a:hover {
text-decoration: none;
}
.hy_2023 .section_keyvisual .container::before {
content: "";
display: block;
width: 101%;
margin: 0 -0.5%;
aspect-ratio: 400/155;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/kv_sp.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
@media screen and (min-width: 992px) {
.hy_2023 .section_keyvisual {
padding: 0;
}
.hy_2023 .section_keyvisual .container {
display: flex;
align-items: center;
padding: 0;
aspect-ratio: 1100/461;
}
.hy_2023 .section_keyvisual .container .txtblock {
position: relative;
width: 36.81%;
margin: 0 auto;
padding: 0;
background-color: transparent;
z-index: 1;
}
.hy_2023 .section_keyvisual .container .txtblock::after {
content: "";
display: block;
width: 100%;
aspect-ratio: 1/1;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
background-color: #ffffff;
border-radius: 100%;
z-index: -1;
}
.hy_2023 .section_keyvisual .container .txtblock .logo_10th {
margin: -25px auto 1%;
}
.hy_2023 .section_keyvisual .container .txtblock .logo_10th + h1 {
margin-top: 0;
}
.hy_2023 .section_keyvisual .container .txtblock h1 {
width: 69%;
max-width: 505px;
margin: 7% auto 4%;
}
.hy_2023 .section_keyvisual .container .txtblock h2 {
width: 75%;
max-width: 550px;
margin: 0 auto 6%;
}
.hy_2023 .section_keyvisual .container .txtblock .btn_container {
margin: 0 auto;
padding: 0 14%;
}
.hy_2023 .section_keyvisual .container .txtblock .btn_container .btn {
position: relative;
margin: 0;
}
.hy_2023 .section_keyvisual .container .txtblock .btn_container .btn a {
top: 0;
font-size: 1.4vw;
z-index: 2;
transition: all 0.2s;
}
.hy_2023 .section_keyvisual .container .txtblock .btn_container .btn a:hover {
top: -2px;
box-shadow: 0 5px 8px rgba(0, 0, 0, 0.3);
}
.hy_2023 .section_keyvisual .container .txtblock .btn_container .btn:last-child {
display: none;
}
.hy_2023 .section_keyvisual .container .txtblock .tel {
margin: 15px 0 0;
}
.hy_2023 .section_keyvisual .container .txtblock .tel a {
font-size: 1.1vw;
letter-spacing: 0.3em;
padding-left: 1.6em;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_tel_black.svg);
background-size: 1.4em auto;
color: #5E5B55;
}
.hy_2023 .section_keyvisual .container .txtblock .tel a span {
font-size: 0.7em;
}
.hy_2023 .section_keyvisual .container::before, .hy_2023 .section_keyvisual .container::after {
content: "";
display: block;
margin: 0;
position: absolute;
top: 0;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
z-index: 2;
}
.hy_2023 .section_keyvisual .container::before {
width: 35.45%;
aspect-ratio: 390/461;
left: 0;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/kv_pc_l.svg);
}
.hy_2023 .section_keyvisual .container::after {
width: 38.18%;
aspect-ratio: 420/461;
right: 0;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/kv_pc_r.svg);
}
}
@media screen and (min-width: 1200px) {
.hy_2023 .section_keyvisual .container .txtblock .btn_container .btn a {
font-size: 21px;
}
.hy_2023 .section_keyvisual .container .txtblock .tel a {
font-size: 15px;
}
}
.hy_2023 .section_customers {
position: relative;
padding-bottom: 10px;
}
.hy_2023 .section_customers .container {
max-width: 740px;
}
.hy_2023 .section_customers .logo {
animation: customers_logo 50s linear infinite;
margin-top: 10px;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/customers_logo_2411.png);
background-repeat: repeat-x;
background-size: auto 100%;
height: 50px;
width: 100%;
}
.hy_2023 .section_customers::after {
content: "";
display: block;
width: calc(100% - 40px);
max-width: 964px;
height: 0;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: auto;
border-top: 1px solid #DBD8D2;
}
@keyframes customers_logo {
0% {
background-position: 0 0;
}
100% {
background-position: -2700px 0;
}
}
@media screen and (min-width: 768px) {
.hy_2023 .section_customers {
padding-bottom: 20px;
}
.hy_2023 .section_customers .logo {
margin-top: 20px;
}
}
.hy_2023 .section_service_header {
position: relative;
padding-bottom: 10px;
}
.hy_2023 .section_service_header .txtblock {
padding: 20px;
}
.hy_2023 .section_service_header .txtblock h1 {
margin-bottom: 25px;
padding: 6px 20px 13px;
text-align: center;
font-size: 12px;
font-weight: 500;
letter-spacing: 0.15em;
border-radius: 20px;
color: #5E5B55;
}
.hy_2023 .section_service_header .txtblock h1 span {
display: block;
margin-top: 8px;
padding-bottom: 0.1em;
font-size: 23px;
line-height: 1.5;
background-color: #ffffff;
border-radius: 100px;
}
.hy_2023 .section_service_header .txtblock h1 span::before {
content: none;
}
.hy_2023 .section_service_header .txtblock h2 {
margin: 32px -20px 17px;
font-size: 16px;
line-height: 1.7;
text-align: center;
}
.hy_2023 .section_service_header .txtblock .btn_container .btn a {
min-width: 11.5em;
padding: 0.8em 2.5em 0.9em 2em;
}
.hy_2023 .section_service_header::after {
content: "";
display: block;
width: calc(100% - 40px);
max-width: 964px;
height: 0;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: auto;
border-top: 1px solid #DBD8D2;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_service_header {
padding-bottom: 25px;
}
.hy_2023 .section_service_header .container {
position: relative;
min-height: 305px;
}
.hy_2023 .section_service_header .txtblock {
width: 51%;
padding: 25px 0;
}
.hy_2023 .section_service_header .txtblock h1 {
margin-bottom: 0;
padding: 10px 20px 13px;
font-size: 14px;
letter-spacing: 0.3em;
}
.hy_2023 .section_service_header .txtblock h1 span {
padding-bottom: 0.1em;
font-size: 29px;
letter-spacing: 0.1em;
}
.hy_2023 .section_service_header .txtblock h2 {
margin: 10px 0;
font-size: 18px;
}
.hy_2023 .section_service_header .txtblock .btn_container {
margin-top: 13px;
}
.hy_2023 .section_service_header .txtblock .btn_container .btn a {
min-width: 11.5em;
}
.hy_2023 .section_service_header .imgblock {
position: absolute;
top: -7px;
right: 25px;
width: 42%;
max-width: 345px;
}
}
@media screen and (min-width: 992px) {
.hy_2023 .section_service_header .txtblock {
width: 56%;
padding: 25px 50px;
}
.hy_2023 .section_service_header .imgblock {
top: -7px;
right: 65px;
}
}
.hy_2023 .section_service_list .service_list {
border-radius: 20px;
padding: 20px;
}
.hy_2023 .section_service_list .service_list ul li {
padding-left: 1em;
font-size: 12px;
}
.hy_2023 .section_service_list .service_list ul li::first-letter {
margin-left: -1em;
}
.hy_2023 .section_service_list .service_list ul li::before {
content: "・";
}
.hy_2023 .section_service_list .service_list .more {
width: 100%;
margin-top: 20px;
font-weight: 700;
text-align: center;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_service_list {
padding-top: 10px;
}
.hy_2023 .section_service_list .service_list {
margin-bottom: 20px;
padding: 40px 0;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.hy_2023 .section_service_list .service_list ul {
width: 23%;
margin: 0 2%;
}
.hy_2023 .section_service_list .service_list ul li {
font-size: 15px;
}
}
.hy_2023 .section_service_pricing {
position: relative;
padding-bottom: 40px;
}
.hy_2023 .section_service_pricing .pricing {
max-width: 685px;
margin: 0 auto;
padding: 15px;
text-align: center;
background-color: #F3EFE9;
border-radius: 10px;
}
.hy_2023 .section_service_pricing .pricing strong {
display: block;
margin-top: 0.5em;
font-size: 16px;
}
.hy_2023 .section_service_pricing .schedule {
margin-top: 30px;
text-align: center;
}
.hy_2023 .section_service_pricing .schedule h3 {
font-size: 14px;
line-height: 1.5;
}
.hy_2023 .section_service_pricing .schedule .schedule_list {
display: flex;
justify-content: space-between;
align-items: center;
align-items: stretch;
margin: 20px auto 0;
max-width: 400px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total {
position: relative;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total::before, .hy_2023 .section_service_pricing .schedule .schedule_list .total::after {
content: "";
position: absolute;
left: 0;
right: 0;
margin: auto;
display: block;
width: 2em;
height: 1px;
background-color: #888580;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total::before {
top: 0;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total::after {
bottom: 0;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span {
display: flex;
align-items: center;
justify-content: center;
position: relative;
width: 4em;
height: 100%;
margin: 0 auto;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span::before, .hy_2023 .section_service_pricing .schedule .schedule_list .total > span::after {
content: "";
position: absolute;
left: 0;
right: 0;
margin: auto;
display: block;
width: 9px;
height: 9px;
background-color: #888580;
border-radius: 10px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span::before {
top: -4px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span::after {
bottom: -4px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span > span::before, .hy_2023 .section_service_pricing .schedule .schedule_list .total > span > span::after {
content: "";
position: absolute;
left: 0;
right: 0;
margin: auto;
display: block;
width: 1px;
height: calc(50% - 1em);
background-color: #888580;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span > span::before {
top: 0;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span > span::after {
bottom: 0;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul {
width: calc(100% - 5em);
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .imgblock {
width: 27%;
margin-left: 1%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .txtblock {
text-align: left;
width: 65%;
font-size: 12px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .txtblock h4 {
font-size: 12px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .txtblock .hour {
font-weight: 700;
margin-top: 0.1em;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .txtblock p {
margin-bottom: 0;
line-height: 1.5;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.bg_01 {
background-color: #C4D8DD;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.bg_02 {
background-color: #E6C8C6;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.bg_03 {
background-color: #EAE6E1;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.bg_04 {
background-color: #DCC4B2;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.bg_05 {
background-color: #BFCFCD;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_service_pricing {
padding-bottom: 50px;
}
.hy_2023 .section_service_pricing .pricing {
padding: 15px 15px 20px;
}
.hy_2023 .section_service_pricing .pricing strong {
margin-top: 0.1em;
font-size: 20px;
letter-spacing: 0.1em;
}
.hy_2023 .section_service_pricing .schedule h3 {
font-size: 20px;
letter-spacing: 0.1em;
}
.hy_2023 .section_service_pricing .schedule .schedule_list {
display: block;
margin: 20px auto 0;
max-width: none;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total::before, .hy_2023 .section_service_pricing .schedule .schedule_list .total::after {
top: 0;
bottom: 0;
width: 1px;
height: 2em;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total::before {
left: 0;
right: auto;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total::after {
left: auto;
right: 0;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span {
width: 100%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span::before, .hy_2023 .section_service_pricing .schedule .schedule_list .total > span::after {
top: 0;
bottom: 0;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span::before {
left: -4px;
right: auto;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span::after {
left: auto;
right: -4px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span > span {
font-size: 15px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span > span::before, .hy_2023 .section_service_pricing .schedule .schedule_list .total > span > span::after {
top: 0;
bottom: 0;
width: calc(50% - 2.5em);
height: 1px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span > span::before {
left: 0;
right: auto;
}
.hy_2023 .section_service_pricing .schedule .schedule_list .total > span > span::after {
left: auto;
right: 0;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul {
display: flex;
margin-top: 7px;
width: 100%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li {
flex-direction: column;
justify-content: flex-start;
padding: 15px 0.4em 20px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .imgblock {
display: flex;
align-items: center;
justify-content: center;
width: 90px;
margin: 0 auto 12px;
aspect-ratio: 200/150;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .txtblock {
text-align: center;
width: auto;
font-size: 12px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .txtblock h4 {
font-size: 13px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .txtblock .hour {
font-size: 13px;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li .txtblock p {
text-align: left;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.hour_01 {
width: 3.3333333333%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.hour_02 {
width: 6.6666666667%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.hour_03 {
width: 10%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.hour_04 {
width: 13.3333333333%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.hour_05 {
width: 16.6666666667%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.hour_06 {
width: 20%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.hour_07 {
width: 23.3333333333%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.hour_08 {
width: 26.6666666667%;
}
.hy_2023 .section_service_pricing .schedule .schedule_list ul li.hour_09 {
width: 30%;
}
}
.hy_2023 .section_service_library {
position: relative;
}
.hy_2023 .section_service_library .vk_slider_container {
overflow: hidden;
}
.hy_2023 .section_service_library .vk_slider {
margin: 0 auto 65px;
overflow: visible;
}
.hy_2023 .section_service_library .vk_slider.single {
margin-bottom: 15px;
}
.hy_2023 .section_service_library .vk_slider .swiper-wrapper .swiper-slide img {
width: 100%;
}
.hy_2023 .section_service_library .vk_slider .swiper-button-prev,
.hy_2023 .section_service_library .vk_slider .swiper-button-next {
top: calc(100% + 30px);
bottom: auto;
width: 40px;
height: 40px;
background-color: transparent;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/service_library_arrow.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
border-radius: 100px;
}
.hy_2023 .section_service_library .vk_slider .swiper-button-prev::after,
.hy_2023 .section_service_library .vk_slider .swiper-button-next::after {
content: none;
}
.hy_2023 .section_service_library .vk_slider .swiper-button-prev {
left: calc(50% - 45px);
}
.hy_2023 .section_service_library .vk_slider .swiper-button-next {
right: calc(50% - 45px);
transform: rotate(180deg);
}
.hy_2023 .section_service_library .btn_container .txt {
color: #CB0000;
}
.hy_2023 .section_service_library .btn_container .btn {
margin-top: 10px;
}
.hy_2023 .section_service_library .btn_container .btn a {
padding: 0.75em 2em;
min-width: 20em;
font-size: 14px;
line-height: 1.3;
}
.hy_2023 .section_service_library .btn_container .btn a::after {
position: relative;
top: auto;
bottom: auto;
right: auto;
display: inline-block;
width: 1.2em;
height: 1em;
transform: none;
border: none;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_download_white.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.hy_2023 .section_service_library::before {
content: "";
display: block;
width: calc(100% - 40px);
max-width: 964px;
height: 0;
position: absolute;
top: 0;
left: 0;
right: 0;
margin: auto;
border-top: 1px solid #DBD8D2;
}
.hy_2023 .section_service_library.bg {
background-color: #F3EFE9;
}
.hy_2023 .section_service_library.bg::before {
content: none;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_service_library .vk_slider {
margin: 0 auto 60px;
}
.hy_2023 .section_service_library .vk_slider .swiper-button-prev,
.hy_2023 .section_service_library .vk_slider .swiper-button-next {
top: calc(100% + 36px);
}
.hy_2023 .section_service_library .btn_container {
margin-top: 12px;
}
.hy_2023 .section_service_library .btn_container .btn {
margin-top: 5px;
}
.hy_2023 .section_service_library .btn_container .btn a {
padding: 0.75em 2em;
min-width: 24em;
font-size: 14px;
letter-spacing: 0.1em;
}
}
.post-type-service .hy_2023 .section_about {
background-color: #CB0000;
}
.post-type-service .hy_2023 .section_about .txtblock {
color: #ffffff;
}
@media screen and (min-width: 768px) {
.post-type-service .hy_2023 .section_about .container {
margin-top: 30px;
}
.post-type-service .hy_2023 .section_about .txtblock {
top: -20px;
}
}
.post-name-ppt .hy_2023 .section_service_header .txtblock h1 {
color: #ffffff;
}
.post-name-ppt .hy_2023 .section_service_header .txtblock h1 span {
color: #5E5B55;
}
.post-name-ppt .hy_2023 .section_service_header::after {
content: none;
}
.post-name-ppt .hy_2023 .section_feature_ppt h2 {
margin: 0 -1em;
font-size: 20px;
}
.post-name-ppt .hy_2023 .section_feature_ppt h2 strong {
font-size: 25px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .container {
max-width: 770px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list {
margin-top: 30px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list li {
margin-top: 20px;
padding: 20px;
background-color: #ffffff;
border: 3px solid #024c87;
border-radius: 17px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list li .imgblock {
width: 80%;
max-width: 160px;
margin: 10px auto 15px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list li .txtblock h3 {
text-align: center;
font-size: 16px;
font-weight: 700;
color: #024c87;
margin-bottom: 10px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list li .txtblock p {
margin-bottom: 0;
font-size: 14px;
line-height: 1.4;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 {
position: relative;
padding: 40px 0;
background-color: #024c87;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 h2 {
color: #ffffff;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 .feature_list li .imgblock {
max-width: 280px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 .feature_list li .txtblock p {
font-size: 16px;
font-weight: 700;
line-height: 1.7;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 .feature_list li .txtblock p strong {
color: #024c87;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01::after {
content: "";
display: block;
width: 0;
height: 0;
position: absolute;
top: calc(100% - 1px);
left: 0;
right: 0;
margin: auto;
border-style: solid;
border-right: 41px solid transparent;
border-left: 41px solid transparent;
border-top: 22px solid #024c87;
border-bottom: 0;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-02 {
padding: 50px 0 40px;
background-color: #EEF4F6;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-02 h2 strong {
color: #024c87;
}
.post-name-ppt .hy_2023 .section_service_library_ppt p {
text-align: center;
font-size: 14px;
}
.post-name-ppt .hy_2023 .section_service_library_ppt p:last-child {
margin-top: 30px;
color: #024c87;
}
.post-name-ppt .hy_2023 .section_service_library_ppt .section_service_library_list {
margin-top: -20px;
}
.post-name-ppt .hy_2023 .section_service_library_ppt .section_service_library_list li {
margin: 50px auto 0;
width: 80%;
max-width: 255px;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt {
background-color: #EEF4F6;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing {
position: relative;
max-width: 730px;
margin: 0 auto;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing::before {
content: "＋";
display: block;
width: 1em;
height: 1.1em;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
font-size: 40px;
font-weight: 700;
line-height: 1;
color: #024c87;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
border: 6px solid #024c87;
border-radius: 10px;
min-height: 130px;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 dl {
margin: 0;
padding: 15px 0 10px;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl dt,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 dl dt {
margin-bottom: 0;
font-size: 12px;
font-weight: 500;
letter-spacing: 0.1em;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl dt:first-child,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 dl dt:first-child {
display: inline-block;
padding: 3px 20px;
border: 1px solid #5E5B55;
background-color: #ffffff;
border-radius: 5px;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl dd,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 dl dd {
margin-top: 5px;
margin-bottom: 0;
font-size: 25px;
font-weight: 700;
letter-spacing: 0.1em;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl dd span,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 dl dd span {
margin-left: 0.25em;
letter-spacing: 0.2em;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 {
background-color: #024c87;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl dd {
color: #ffffff;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 {
margin-top: 60px;
background-color: #ffffff;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing + p {
margin: 20px auto 30px;
text-align: center;
}
.post-name-ppt .hy_2023 .section_service_customers .section_service_customers_list {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
max-width: 730px;
margin: 0 auto;
}
.post-name-ppt .hy_2023 .section_service_customers .section_service_customers_list li {
margin: 10px;
width: auto;
height: 37px;
}
.post-name-ppt .hy_2023 .section_service_customers .section_service_customers_list li img {
width: auto;
height: 100%;
}
.post-name-ppt .hy_2023 .section_downloads {
background-color: #EEF4F6;
}
@media screen and (min-width: 768px) {
.post-name-ppt .hy_2023 .section_service_header .imgblock {
top: -30px;
right: 15px;
width: 50%;
max-width: 440px;
}
.post-name-ppt .hy_2023 .section_feature_ppt h2 {
margin: 0;
font-size: 25px;
}
.post-name-ppt .hy_2023 .section_feature_ppt h2 strong {
font-size: 31px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list {
margin-top: 40px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list li {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 20px;
padding: 35px 40px 35px 25px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list li .imgblock {
width: 24%;
margin: 0;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list li .txtblock {
width: 71%;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list li .txtblock h3 {
text-align: left;
font-size: 23px;
margin-bottom: 15px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .feature_list li .txtblock p {
font-size: 14px;
line-height: 1.4;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 {
padding: 40px 0 50px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 .feature_list li {
padding: 25px 20px 25px 25px;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 .feature_list li .imgblock {
width: 43%;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 .feature_list li .txtblock {
width: 54%;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01 .feature_list li .txtblock p {
font-size: 20px;
line-height: 1.8;
letter-spacing: 0.1em;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-01::after {
border-right: 82px solid transparent;
border-left: 82px solid transparent;
border-top: 45px solid #024c87;
}
.post-name-ppt .hy_2023 .section_feature_ppt .bg-02 {
padding: 80px 0 70px;
}
.post-name-ppt .hy_2023 .section_service_library_ppt p {
font-size: 17px;
}
.post-name-ppt .hy_2023 .section_service_library_ppt p:last-child {
margin-top: 0;
}
.post-name-ppt .hy_2023 .section_service_library_ppt .section_service_library_list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-top: 30px;
}
.post-name-ppt .hy_2023 .section_service_library_ppt .section_service_library_list li {
margin: 0 0 30px;
width: 80%;
max-width: 255px;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing {
display: flex;
justify-content: space-between;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 {
justify-content: flex-start;
width: 46%;
min-height: 0;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 dl {
padding: 15px 0 10px;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl dt,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 dl dt {
font-size: 14px;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl dd,
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 dl dd {
margin-top: 5px;
font-size: 25px;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-01 dl dd {
margin-top: 10px;
}
.post-name-ppt .hy_2023 .section_service_pricing_ppt .pricing .price-02 {
margin-top: 0;
}
}
@media screen and (min-width: 992px) {
.post-name-ppt .hy_2023 .section_feature_ppt h2 {
margin: 0 -2em;
}
}
.post-name-accounting .hy_2023 .section_service_header {
padding-bottom: 20px;
}
.post-name-accounting .hy_2023 .section_service_header .txtblock h1 {
margin-bottom: 0;
}
.post-name-accounting .hy_2023 .section_service_header .txtblock h2 {
margin-top: 0;
font-size: 28px;
line-height: 1.5;
}
.post-name-accounting .hy_2023 .section_service_header .txtblock h2 span {
font-size: 18px;
}
.post-name-accounting .hy_2023 .section_service_header .formblock {
margin: 0 -10px;
padding: 20px;
background-color: #ffffff;
border: 1px solid #B4B4B4;
border-radius: 10px;
}
.post-name-accounting .hy_2023 .section_service_header::after {
content: none;
}
.post-name-accounting .hy_2023 .feature_list {
display: block;
}
.post-name-accounting .hy_2023 .feature_list li {
width: 100%;
margin-top: 10px;
padding: 12px 10px 20px;
}
.post-name-accounting .hy_2023 .feature_list li:nth-child(1), .post-name-accounting .hy_2023 .feature_list li:nth-child(2) {
margin-top: 10px;
}
.post-name-accounting .hy_2023 .feature_list li .num {
margin-bottom: 7px;
font-size: 28px;
}
.post-name-accounting .hy_2023 .feature_list li h3 {
font-size: 17px;
}
.post-name-accounting .hy_2023 .feature_list li .imgblock {
width: 50%;
max-width: 160px;
margin: 5px auto;
}
.post-name-accounting .hy_2023 .feature_list li .txtblock p {
font-size: 14px;
text-align: center;
}
.post-name-accounting .hy_2023 .service_list_detail > li {
margin-top: 4px;
padding: 0 0 20px 0;
background-color: #BCE8E0;
border-radius: 7px;
}
.post-name-accounting .hy_2023 .service_list_detail > li h3 {
position: relative;
margin-bottom: 0.5em;
padding: 0.8em 0;
font-size: 24px;
text-align: center;
color: #ffffff;
background-color: #47AD99;
border-radius: 7px 7px 0 0;
}
.post-name-accounting .hy_2023 .service_list_detail > li h3::after {
content: "";
position: absolute;
top: calc(100% - 1px);
left: 0;
right: 0;
margin: 0 auto;
display: block;
width: 13px;
height: 10px;
background-color: #47AD99;
clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.post-name-accounting .hy_2023 .service_list_detail > li p {
margin: 0 1em;
text-align: center;
font-weight: 700;
}
.post-name-accounting .hy_2023 .service_list_detail > li .imgblock {
width: 40%;
max-width: 160px;
margin: 15px auto;
}
.post-name-accounting .hy_2023 .service_list_detail > li ul {
max-width: 18em;
margin: 0 auto;
}
.post-name-accounting .hy_2023 .service_list_detail > li ul li {
position: relative;
margin-top: 2px;
padding-left: 3em;
background-color: #ffffff;
border-radius: 999px;
line-height: 1.75;
}
.post-name-accounting .hy_2023 .service_list_detail > li ul li::before {
content: "";
position: absolute;
left: 1em;
top: 0.25em;
display: block;
width: 1.2em;
height: 1.2em;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/service/accounting/service-accounting-icon-check.png);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.post-name-accounting .hy_2023 .service_list_detail > li .more {
margin-top: 5px;
text-align: center;
font-weight: 700;
}
.post-name-accounting .hy_2023 .service_list_detail > li:first-child {
background-color: #FFF8F8;
}
.post-name-accounting .hy_2023 .service_list_detail > li:first-child h3 {
background-color: #FAE7E7;
color: #CB0000;
}
.post-name-accounting .hy_2023 .service_list_detail > li:first-child h3::after {
background-color: #FAE7E7;
}
.post-name-accounting .hy_2023 .section_support_list {
background-color: #CB0000;
}
.post-name-accounting .hy_2023 .section_support_list h2 {
color: #ffffff;
}
.post-name-accounting .hy_2023 .section_support_list .support_list li .txtblock {
text-align: center;
padding: 26px;
background-color: #ffffff;
}
.post-name-accounting .hy_2023 .section_support_list .support_list li .txtblock .case {
display: inline-block;
margin: 0 auto;
min-width: 8em;
font-size: 16px;
font-weight: 700;
line-height: 2;
color: #ffffff;
background-color: #CB0000;
border-radius: 999px;
}
.post-name-accounting .hy_2023 .section_support_list .support_list li .txtblock .case span {
font-size: 18px;
}
.post-name-accounting .hy_2023 .section_support_list .support_list li .txtblock h3 {
margin: 10px 0;
font-size: 17px;
line-height: 1.8;
letter-spacing: 0.15em;
}
.post-name-accounting .hy_2023 .section_support_list .support_list li .txtblock p {
max-width: 16em;
margin: 0 auto;
text-align: left;
}
.post-name-accounting .hy_2023 .section_support_list .support_list li .imgblock {
margin: 10px auto 20px;
max-width: 400px;
}
.post-name-accounting .hy_2023 .section_support_list .more {
text-align: center;
color: #ffffff;
font-weight: 700;
}
.post-name-accounting .hy_2023 .section_plan_detail .btn_container .txt {
color: #CB0000;
}
.post-name-accounting .hy_2023 .section_plan_detail .btn_container .btn {
margin-top: 10px;
}
.post-name-accounting .hy_2023 .section_plan_detail .btn_container .btn a {
padding: 0.75em 2em;
min-width: 20em;
font-size: 14px;
line-height: 1.3;
}
.post-name-accounting .hy_2023 .section_plan_detail .btn_container .btn a::after {
position: relative;
top: auto;
bottom: auto;
right: auto;
display: inline-block;
width: 1.2em;
height: 1em;
transform: none;
border: none;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_download_white.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.post-name-accounting .hy_2023 .section_form h2 {
color: #CB0000;
}
.post-name-accounting .hy_2023 .section_form .txtblock {
margin-top: 45px;
}
.post-name-accounting .hy_2023 .section_form .txtblock h3 {
font-size: 24px;
line-height: 1.7;
text-align: center;
}
.post-name-accounting .hy_2023 .section_form .txtblock h3 span {
color: #CB0000;
}
.post-name-accounting .hy_2023 .section_form .txtblock .imgblock {
margin: 25px auto;
}
.post-name-accounting .hy_2023 .section_form .txtblock .recommend {
padding: 25px 0;
background-color: #F3EFE9;
border-radius: 10px;
}
.post-name-accounting .hy_2023 .section_form .txtblock .recommend h4 {
font-size: 16px;
font-weight: 700;
color: #CB0000;
text-align: center;
}
.post-name-accounting .hy_2023 .section_form .txtblock .recommend ul {
margin: 15px auto 0;
max-width: 22em;
}
.post-name-accounting .hy_2023 .section_form .txtblock .recommend ul li {
position: relative;
margin-top: 5px;
padding-left: 3em;
line-height: 1.75;
}
.post-name-accounting .hy_2023 .section_form .txtblock .recommend ul li::before {
content: "";
position: absolute;
left: 1em;
top: 0.25em;
display: block;
width: 1.2em;
height: 1.2em;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/service/accounting/service-accounting-icon-check.png);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.post-name-accounting .hy_2023 .section_form .formblock {
margin: 20px auto;
padding: 20px 10px 15px 18px;
background-color: #ffffff;
border: 1px solid #B4B4B4;
border-radius: 10px;
}
.post-name-accounting .hy_2023 .section_plan_detail .table_container {
margin: 0 -20px;
padding: 0 20px;
overflow-x: scroll;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table {
min-width: 678px;
margin: 6em 0 0;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table p {
margin: 0;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table th, .post-name-accounting .hy_2023 .section_plan_detail .plan_table td {
padding: 5px;
border: 4px solid #ffffff;
background-color: #FAFAFA;
text-align: center;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table th[rowspan] {
writing-mode: vertical-rl;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table th {
font-size: 13px;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .blank {
min-width: 164px;
background-color: transparent;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan {
position: relative;
min-width: 170px;
padding: 0.5em 0;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan h3 {
font-size: 20px;
font-weight: 700;
line-height: 1.5;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan .pop {
position: absolute;
bottom: 100%;
left: 0;
right: 0;
margin: 0;
display: block;
width: 100%;
padding: 0.5em 0;
border-radius: 999px;
color: #ffffff;
font-size: 15px;
font-weight: 400;
line-height: 1.3;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan .pop::after {
content: "";
position: absolute;
top: calc(100% - 1px);
left: 0;
right: 0;
margin: 0 auto;
display: block;
width: 10px;
height: 10px;
clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan.plan1 {
background-color: #FAE7E7;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan.plan1 .pop, .post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan.plan1 .pop::after {
background-color: #CB0000;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan.plan2 {
background-color: #BCE8E0;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan.plan2 .pop, .post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan.plan2 .pop::after {
background-color: #3DBCA5;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan.plan3 {
background-color: #7ED7C7;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan.plan3 .pop, .post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan.plan3 .pop::after {
background-color: #47AD99;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .price td span {
display: block;
font-size: 20px;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .feature td {
font-size: 13px;
font-weight: 700;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .feature td span {
color: #CB0000;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .symbol {
font-size: 18px;
}
@media screen and (min-width: 768px) {
.post-name-accounting .hy_2023 .section_service_header {
padding: 100px 0 80px;
}
.post-name-accounting .hy_2023 .section_service_header .container {
display: flex;
justify-content: space-between;
}
.post-name-accounting .hy_2023 .section_service_header .txtblock {
width: 49%;
padding: 0 20px;
}
.post-name-accounting .hy_2023 .section_service_header .txtblock h2 {
margin: 30px 0 50px;
text-align: left;
font-size: 34px;
}
.post-name-accounting .hy_2023 .section_service_header .txtblock h2 span {
display: inline-block;
margin-bottom: 20px;
}
.post-name-accounting .hy_2023 .section_service_header .txtblock .imgblock {
position: relative;
top: 0;
right: 0;
width: 100%;
max-width: none;
}
.post-name-accounting .hy_2023 .section_service_header .formblock {
width: 52%;
}
.post-name-accounting .hy_2023 .feature_list {
display: flex;
max-width: 770px;
margin: 0 auto;
}
.post-name-accounting .hy_2023 .feature_list li {
width: calc(33.333% - 50px);
min-width: 205px;
margin-top: 0;
padding: 12px 22px 25px;
}
.post-name-accounting .hy_2023 .feature_list li:nth-child(1), .post-name-accounting .hy_2023 .feature_list li:nth-child(2) {
margin-top: 0;
}
.post-name-accounting .hy_2023 .feature_list li .num {
margin-bottom: 7px;
font-size: 28px;
}
.post-name-accounting .hy_2023 .feature_list li h3 {
font-size: 17px;
}
.post-name-accounting .hy_2023 .feature_list li .imgblock {
width: 100%;
max-width: none;
margin: 10px auto;
}
.post-name-accounting .hy_2023 .feature_list li .txtblock p {
font-size: 14px;
text-align: left;
}
.post-name-accounting .hy_2023 .service_list_detail {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.post-name-accounting .hy_2023 .service_list_detail > li {
position: relative;
width: calc(50% - 8px);
margin-top: 16px;
padding: 0 0 17px 0;
}
.post-name-accounting .hy_2023 .service_list_detail > li h3 {
margin-bottom: 1.3em;
}
.post-name-accounting .hy_2023 .service_list_detail > li h3::after {
width: 33px;
height: 10px;
}
.post-name-accounting .hy_2023 .service_list_detail > li p {
font-size: 15px;
}
.post-name-accounting .hy_2023 .service_list_detail > li .imgblock {
position: absolute;
right: 5px;
bottom: 20px;
width: 26%;
max-width: none;
margin: 0;
z-index: 1;
}
.post-name-accounting .hy_2023 .service_list_detail > li ul {
max-width: 19em;
margin: 10px auto;
}
.post-name-accounting .hy_2023 .service_list_detail > li ul li {
font-size: 15px;
margin-top: 2px;
padding-left: 3em;
line-height: 1.6;
}
.post-name-accounting .hy_2023 .service_list_detail > li ul li::before {
left: 1em;
top: 0.25em;
width: 1.2em;
height: 1.2em;
}
.post-name-accounting .hy_2023 .service_list_detail > li .more {
margin-top: 5px;
}
.post-name-accounting .hy_2023 .service_list_detail > li:first-child {
margin-top: 0;
width: 100%;
}
.post-name-accounting .hy_2023 .service_list_detail > li:first-child .imgblock {
width: 16%;
right: 43px;
bottom: 26px;
}
.post-name-accounting .hy_2023 .service_list_detail > li:first-child ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 38em;
}
.post-name-accounting .hy_2023 .service_list_detail > li:first-child ul li {
width: calc(50% - 2px);
}
.post-name-accounting .hy_2023 .section_support_list .support_list {
display: flex;
justify-content: space-between;
}
.post-name-accounting .hy_2023 .section_support_list .support_list li {
display: flex;
flex-direction: column;
width: calc(33.333% - 10px);
}
.post-name-accounting .hy_2023 .section_support_list .support_list li .txtblock {
flex-grow: 1;
}
.post-name-accounting .hy_2023 .section_support_list .support_list li .imgblock {
width: 80%;
max-width: none;
margin: 10px auto 20px;
}
.post-name-accounting .hy_2023 .section_support_list .more {
margin-top: -3em;
text-align: right;
}
.post-name-accounting .hy_2023 .section_plan_detail .btn_container {
margin-top: 12px;
}
.post-name-accounting .hy_2023 .section_plan_detail .btn_container .btn {
margin-top: 5px;
}
.post-name-accounting .hy_2023 .section_plan_detail .btn_container .btn a {
padding: 0.75em 2em;
min-width: 24em;
font-size: 14px;
letter-spacing: 0.1em;
}
.post-name-accounting .hy_2023 .section_form .container {
display: flex;
justify-content: space-between;
}
.post-name-accounting .hy_2023 .section_form .txtblock {
width: 46%;
margin-top: 55px;
}
.post-name-accounting .hy_2023 .section_form .txtblock h3 {
font-size: 26px;
line-height: 1.5;
}
.post-name-accounting .hy_2023 .section_form .txtblock .imgblock {
margin: 30px auto;
}
.post-name-accounting .hy_2023 .section_form .txtblock .recommend {
padding: 30px 0;
}
.post-name-accounting .hy_2023 .section_form .txtblock .recommend h4 {
font-size: 18px;
}
.post-name-accounting .hy_2023 .section_form .txtblock .recommend ul {
font-size: 16px;
}
.post-name-accounting .hy_2023 .section_form .formblock {
width: 52%;
margin: 0;
padding: 20px;
}
.post-name-accounting .hy_2023 .section_plan_detail .table_container {
margin: 0 -20px;
padding: 0;
overflow-x: hidden;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table {
margin: 5em 0 0;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table th, .post-name-accounting .hy_2023 .section_plan_detail .plan_table td {
padding: 15px 5px;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table th {
font-size: 15px;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan {
width: 25.8%;
padding: 1.5em 0;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan .pop {
padding: 1em 0;
font-size: 15px;
line-height: 1.3;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .plan .pop::after {
width: 12px;
height: 9px;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .price td span {
font-size: 20px;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .feature td {
font-size: 15px;
}
.post-name-accounting .hy_2023 .section_plan_detail .plan_table .symbol {
font-size: 18px;
}
}
.hy_2023 .section_plan_list .h1 + p {
text-align: center;
}
.hy_2023 .section_plan_list .plan_list {
margin: 35px 0;
}
.hy_2023 .section_plan_list .plan_list li {
position: relative;
margin-top: 35px;
padding: 35px 15px 25px;
border: 2px solid;
border-radius: 7px;
}
.hy_2023 .section_plan_list .plan_list li h2 {
position: absolute;
top: -17px;
left: -10px;
padding: 7px 10px;
font-size: 14px;
color: #ffffff;
}
.hy_2023 .section_plan_list .plan_list li .txtblock h3 {
margin-bottom: 10px;
font-size: 18px;
font-weight: 700;
color: #000;
text-align: center;
}
.hy_2023 .section_plan_list .plan_list li .imgblock {
margin: 20px auto 0;
width: 80%;
}
.hy_2023 .section_plan_list .plan_list li.plan_01 {
border-color: #CB0000;
}
.hy_2023 .section_plan_list .plan_list li.plan_01 h2 {
background-color: #CB0000;
}
.hy_2023 .section_plan_list .plan_list li.plan_02 {
border-color: #e58e76;
}
.hy_2023 .section_plan_list .plan_list li.plan_02 h2 {
background-color: #e58e76;
}
.hy_2023 .section_plan_list .plan_list li.plan_03 {
border-color: #f39d74;
}
.hy_2023 .section_plan_list .plan_list li.plan_03 h2 {
background-color: #f39d74;
}
.hy_2023 .section_plan_list .plan_list + p {
text-align: center;
}
.hy_2023 .section_plan_list .btn_container {
margin-top: 35px;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_plan_list .h1 + p {
font-size: 23px;
}
.hy_2023 .section_plan_list .plan_list {
display: flex;
justify-content: space-between;
margin: 50px 0 35px;
}
.hy_2023 .section_plan_list .plan_list li {
width: calc(33.33333% - 10px);
margin-top: 0;
padding: 40px 10px 20px 20px;
}
.hy_2023 .section_plan_list .plan_list li h2 {
top: -22px;
left: -10px;
padding: 9px 18px;
font-size: 15px;
}
.hy_2023 .section_plan_list .plan_list li .txtblock h3 {
margin-bottom: 10px;
font-size: 25px;
}
.hy_2023 .section_plan_list .plan_list + p {
font-size: 17px;
}
.hy_2023 .section_plan_list .btn_container {
margin-top: 25px;
}
}
.hy_2023 .section_plan_detail .plan_detail {
margin: 20px 0 0;
}
.hy_2023 .section_plan_detail .plan_detail .column {
margin-bottom: 30px;
}
.hy_2023 .section_plan_detail .plan_detail .column .th {
color: #ffffff;
font-size: 20px;
font-weight: 700;
letter-spacing: 0.12em;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .plan_name {
display: block;
line-height: 1em;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .plan_name span {
display: block;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .label {
display: block;
width: 90px;
margin: 0 auto 10px;
background: #fff;
color: #b59c2c;
line-height: 25px;
text-align: center;
font-size: 14px;
font-weight: bold;
}
.hy_2023 .section_plan_detail .plan_detail .column .th, .hy_2023 .section_plan_detail .plan_detail .column .td {
position: relative;
padding: 20px 15px;
border-bottom: 1px solid #5E5B55;
}
.hy_2023 .section_plan_detail .plan_detail .column .th::after, .hy_2023 .section_plan_detail .plan_detail .column .td::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
margin: 0 auto;
display: block;
width: 100%;
height: 100%;
z-index: -1;
}
.hy_2023 .section_plan_detail .plan_detail .column .th ul li, .hy_2023 .section_plan_detail .plan_detail .column .td ul li {
margin-left: 1em;
}
.hy_2023 .section_plan_detail .plan_detail .column .th ul li::before, .hy_2023 .section_plan_detail .plan_detail .column .td ul li::before {
content: "✓ ";
}
.hy_2023 .section_plan_detail .plan_detail .column .th ul li::first-letter, .hy_2023 .section_plan_detail .plan_detail .column .td ul li::first-letter {
margin-left: -1em;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .pricing, .hy_2023 .section_plan_detail .plan_detail .column .td .pricing {
display: flex;
justify-content: space-between;
width: 80%;
margin: 10px auto 0;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .pricing dl, .hy_2023 .section_plan_detail .plan_detail .column .td .pricing dl {
width: calc(50% - 6px);
margin: 0;
padding: 10px 0 0;
border: 2px solid;
background-color: #ffffff;
text-align: center;
font-size: 17px;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .pricing dl .price, .hy_2023 .section_plan_detail .plan_detail .column .td .pricing dl .price {
font-weight: 700;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .pricing dl .hour, .hy_2023 .section_plan_detail .plan_detail .column .td .pricing dl .hour {
position: relative;
line-height: 4.5;
z-index: 1;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .pricing dl .hour::after, .hy_2023 .section_plan_detail .plan_detail .column .td .pricing dl .hour::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
display: block;
border-radius: 300px;
z-index: -1;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .pricing dl .hour.hour_s::after, .hy_2023 .section_plan_detail .plan_detail .column .td .pricing dl .hour.hour_s::after {
width: 2.4em;
height: 2.4em;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .pricing dl .hour.hour_l::after, .hy_2023 .section_plan_detail .plan_detail .column .td .pricing dl .hour.hour_l::after {
width: 4em;
height: 4em;
}
.hy_2023 .section_plan_detail .plan_detail .column .td:before {
content: attr(data-label);
display: block;
font-weight: 700;
margin-bottom: 5px;
}
.hy_2023 .section_plan_detail .plan_detail .column:first-child {
display: none;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_01 .td::after {
background-color: #ffe6e6;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_01 .th::after {
background-color: #CB0000;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_01 .th .label {
color: #b59c2c;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_01 .pricing dl {
border-color: #CB0000;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_01 .pricing dl .hour::after {
background-color: #ffe6e6;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_02 .td::after {
background-color: #fff2ee;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_02 .th::after {
background-color: #e58e76;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_02 .pricing dl {
border-color: #e58e76;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_02 .pricing dl .hour::after {
background-color: #fff2ee;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_03 .td::after {
background-color: #F9E3D7;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_03 .th::after {
background-color: #F39D74;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_03 .th .label {
color: #CC0000;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_03 .pricing dl {
border-color: #F39D74;
margin: 0 auto;
width: 100%;
}
.hy_2023 .section_plan_detail .plan_detail .column.plan_03 .pricing dl .hour::after {
background-color: #F9E3D7;
}
.hy_2023 .section_plan_detail .btn_container {
margin-top: 30px;
}
.hy_2023 .section_plan_detail.bg {
background-color: #F3EFE9;
}
.hy_2023 .section_plan_detail.bg .container {
position: relative;
z-index: 1;
}
.hy_2023 .section_plan_detail.bg .plan_detail {
background: #ffffff;
position: relative;
z-index: -1;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_plan_detail .plan_detail {
display: grid;
grid-template-columns: 8em 1fr 1fr 1fr;
margin: 40px 0 0;
}
.hy_2023 .section_plan_detail .plan_detail .column {
display: grid;
grid-template-rows: subgrid;
grid-row: 1/span 8;
grid-column: auto/span 1;
margin-bottom: 0;
}
.hy_2023 .section_plan_detail .plan_detail .column .th, .hy_2023 .section_plan_detail .plan_detail .column .td {
padding: 25px 20px;
}
.hy_2023 .section_plan_detail .plan_detail .column .th::after, .hy_2023 .section_plan_detail .plan_detail .column .td::after {
width: 99%;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .pricing, .hy_2023 .section_plan_detail .plan_detail .column .td .pricing {
margin: 0 auto;
}
.hy_2023 .section_plan_detail .plan_detail .column:last-child .th::after, .hy_2023 .section_plan_detail .plan_detail .column:last-child .td::after {
left: auto;
}
.hy_2023 .section_plan_detail .plan_detail .column .th {
justify-content: flex-end;
}
.hy_2023 .section_plan_detail .plan_detail .column .th .plan_name {
height: 40px;
}
.hy_2023 .section_plan_detail .plan_detail .column .td {
display: flex;
align-items: center;
}
.hy_2023 .section_plan_detail .plan_detail .column:first-child {
display: grid;
}
.hy_2023 .section_plan_detail .plan_detail .column .td:before {
content: none;
}
.hy_2023 .section_plan_detail .btn_container {
margin-top: 30px;
}
}
.hy_2023 .section_company_logo .container,
.hy_2023 .section_company_vision .container,
.hy_2023 .section_company_message .container,
.hy_2023 .section_company_profile .container {
padding: 0 50px;
max-width: 845px;
}
.hy_2023 .section_company_logo .company_name .imgblock {
margin: 35px auto 40px;
width: 85%;
max-width: 345px;
}
.hy_2023 .section_company_logo .company_name .txtblock {
text-align: center;
font-size: 15px;
letter-spacing: 0.2em;
}
.hy_2023 .section_company_logo .company_name .txtblock span {
font-size: 18px;
font-weight: 700;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_company_logo .company_name {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
margin: 80px -40px 0;
padding: 35px 0;
}
.hy_2023 .section_company_logo .company_name .imgblock {
width: 50%;
margin: 0;
max-width: 345px;
}
.hy_2023 .section_company_logo .company_name .txtblock {
width: 50%;
font-size: 23px;
letter-spacing: 0.2em;
}
.hy_2023 .section_company_logo .company_name .txtblock span {
font-size: 28px;
}
.hy_2023 .section_company_logo .company_name::after {
content: "";
display: block;
width: 3px;
height: 100%;
position: absolute;
top: 0;
left: 0;
right: 0;
margin: 0 auto;
background-color: #F3EFE9;
}
}
.hy_2023 .section_company_vision {
padding-top: 50px;
}
.hy_2023 .section_company_vision h2 {
margin-bottom: 0.7em;
text-align: center;
font-size: 17px;
font-weight: 400;
}
.hy_2023 .section_company_vision h2 .border_yellow,
.hy_2023 .section_company_vision h2 .border_blue {
display: inline-block;
padding: 0 5px 7px;
border-bottom: 3px solid;
}
.hy_2023 .section_company_vision h2 .border_yellow {
border-color: #ffd400;
}
.hy_2023 .section_company_vision h2 .border_blue {
border-color: #80b5e0;
}
.hy_2023 .section_company_vision h3 {
margin-bottom: 1.8em;
text-align: center;
font-size: 18px;
line-height: 1.5;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_company_vision {
padding-top: 50px;
}
.hy_2023 .section_company_vision h2 {
margin-bottom: 0.7em;
font-size: 20px;
}
.hy_2023 .section_company_vision h2 .border_yellow,
.hy_2023 .section_company_vision h2 .border_blue {
padding: 0 5px 7px;
}
.hy_2023 .section_company_vision h3 {
margin-bottom: 1.3em;
font-size: 25px;
letter-spacing: 0.23em;
}
.hy_2023 .section_company_vision p {
font-size: 17px;
line-height: 2.1;
}
}
.hy_2023 .section_company_message {
padding-bottom: 50px;
}
.hy_2023 .section_company_message h2 {
margin-bottom: 2em;
text-align: center;
font-size: 18px;
}
.hy_2023 .section_company_message h2 span {
position: relative;
display: inline-block;
padding: 0 5px 15px;
}
.hy_2023 .section_company_message h2 span::before, .hy_2023 .section_company_message h2 span::after {
content: "";
display: block;
width: 50%;
height: 0;
position: absolute;
bottom: 0;
border-bottom: 3px solid;
}
.hy_2023 .section_company_message h2 span::before {
left: 0;
border-color: #ffd400;
}
.hy_2023 .section_company_message h2 span::after {
right: 0;
border-color: #80b5e0;
}
.hy_2023 .section_company_message .message {
display: flex;
flex-direction: column-reverse;
}
.hy_2023 .section_company_message .message .imgblock {
text-align: center;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_company_message {
padding-bottom: 50px;
}
.hy_2023 .section_company_message h2 {
position: relative;
margin-bottom: 2em;
font-size: 25px;
}
.hy_2023 .section_company_message h2 span {
position: initial;
padding: 0 1em;
background-color: #ffffff;
}
.hy_2023 .section_company_message h2 span::before, .hy_2023 .section_company_message h2 span::after {
top: 0;
margin: auto;
z-index: -1;
}
.hy_2023 .section_company_message h2 span::before {
left: 0;
border-color: #ffd400;
}
.hy_2023 .section_company_message h2 span::after {
right: 0;
border-color: #80b5e0;
}
.hy_2023 .section_company_message .message {
display: block;
max-width: 615px;
margin: 0 auto;
}
.hy_2023 .section_company_message .message .imgblock {
float: right;
width: 217px;
margin: 0 0 10px 1.5em;
}
.hy_2023 .section_company_message .message .txtblock p {
font-size: 15px;
}
}
.hy_2023 .section_company_profile {
background-color: #F3EFE9;
}
.hy_2023 .section_company_profile dl {
max-width: 615px;
margin: -1em auto 0;
}
.hy_2023 .section_company_profile dl dt {
font-weight: 400;
margin-top: 2em;
}
.hy_2023 .section_company_profile dl dd {
font-weight: 700;
}
.hy_2023 .section_company_profile dl dd a {
color: #5E5B55;
}
.hy_2023 .section_company_profile dl dd ul li {
padding-left: 1em;
}
.hy_2023 .section_company_profile dl dd ul li::first-letter {
margin-left: -1em;
}
.hy_2023 .section_company_profile dl dd ul li::before {
content: "・";
}
@media screen and (min-width: 768px) {
.hy_2023 .section_company_profile dl {
display: flex;
flex-wrap: wrap;
margin: 0 auto 2em;
font-size: 15px;
line-height: 1.5;
}
.hy_2023 .section_company_profile dl dt {
width: 7em;
margin-top: 2em;
}
.hy_2023 .section_company_profile dl dd {
width: calc(100% - 7em);
margin-top: 2em;
}
}
.hy_2023 .section_contact p {
line-height: 1.6;
}
.hy_2023 .section_contact .h1 + p a {
color: #306B9B;
text-decoration: underline;
}
.hy_2023 .section_contact h2 {
font-size: 22px;
text-align: left;
letter-spacing: normal;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
margin-bottom: 1em;
}
.hy_2023 .section_contact h2::before {
content: "";
display: inline-block;
width: 1em;
height: 1em;
background: #CC141C;
border-radius: 50%;
margin-right: 0.2em;
}
.hy_2023 .section_contact h2 span {
display: inline-block;
width: calc(100% - 1.2em);
}
.hy_2023 .section_contact .contents_area {
margin-top: 40px;
}
.hy_2023 .section_contact .formblock {
margin-bottom: 60px;
padding: 20px 0;
}
.hy_2023 .section_contact .textblock {
padding: 20px 0;
}
.hy_2023 .section_contact .tel p a {
font-size: 20px;
font-weight: bold;
}
.hy_2023 .section_contact .tel p span {
font-size: 0.8em;
display: inline-block;
}
.hy_2023 .section_contact .merit {
margin-top: 40px;
}
.hy_2023 .section_contact .merit ul li {
padding: 20px;
}
.hy_2023 .section_contact .merit ul li:not(:first-child) {
border-top: 2px solid #B5B5B6;
}
.hy_2023 .section_contact .merit ul li .imgblock {
width: 100%;
}
.hy_2023 .section_contact .merit ul li p {
margin: 1em 0 0;
}
@media screen and (min-width: 480px) {
.hy_2023 .section_contact .merit ul {
display: flex;
flex-wrap: wrap;
}
.hy_2023 .section_contact .merit ul li {
width: calc((100% - 2px) / 2);
}
.hy_2023 .section_contact .merit ul li:nth-child(odd) {
border-right: 2px solid #B5B5B6;
}
.hy_2023 .section_contact .merit ul li:not(:first-child) {
border-top: none;
}
.hy_2023 .section_contact .merit ul li:nth-child(n+3) {
border-top: 2px solid #B5B5B6;
}
}
@media screen and (min-width: 768px) {
.hy_2023 .section_contact .container {
width: 100%;
max-width: 1000px;
}
.hy_2023 .section_contact .h1 + p {
text-align: center;
}
.hy_2023 .section_contact .contents_area {
display: flex;
flex-direction: row-reverse;
}
.hy_2023 .section_contact .formblock {
width: calc((100% - 2px) / 2);
min-width: 536px;
margin-bottom: 0;
padding-left: 30px;
}
.hy_2023 .section_contact .textblock {
width: calc((100% - 2px) / 2);
max-width: calc(100% - 536px);
padding-right: 20px;
border-right: 2px dotted #B5B5B6;
}
.hy_2023 .section_contact .merit ul {
display: flex;
flex-wrap: wrap;
}
.hy_2023 .section_contact .merit ul li {
width: 100%;
}
.hy_2023 .section_contact .merit ul li:nth-child(odd), .hy_2023 .section_contact .merit ul li:not(:first-child), .hy_2023 .section_contact .merit ul li:nth-child(n+3) {
border: none;
}
.hy_2023 .section_contact .merit ul li:not(:first-child) {
border-top: 2px solid #B5B5B6;
}
}
@media screen and (min-width: 992px) {
.hy_2023 .section_contact .formblock {
padding-left: 40px;
}
.hy_2023 .section_contact .textblock {
padding-right: 40px;
}
.hy_2023 .section_contact .merit ul {
display: flex;
flex-wrap: wrap;
}
.hy_2023 .section_contact .merit ul li {
width: calc((100% - 2px) / 2);
}
.hy_2023 .section_contact .merit ul li:nth-child(odd) {
border-right: 2px solid #B5B5B6;
}
.hy_2023 .section_contact .merit ul li:not(:first-child) {
border-top: none;
}
.hy_2023 .section_contact .merit ul li:nth-child(n+3) {
border-top: 2px solid #B5B5B6;
}
}
.hy_2023 .section_thanks_contact {
border-bottom: 2px dotted #B5B5B6;
}
.hy_2023 .section_thanks_contact .appointment {
border-radius: 1em;
background: #fbecf0;
padding: 20px;
}
.hy_2023 .section_thanks_contact .appointment .imgblock {
margin: 50px auto 0 0;
width: 80%;
}
.hy_2023 .section_thanks_contact .btn_container {
margin-top: 30px;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_thanks_contact .h1 + p {
font-size: 20px;
text-align: center;
}
.hy_2023 .section_thanks_contact .appointment {
font-size: 20px;
border-radius: 1.5em;
padding: 50px 30px;
display: flex;
flex-wrap: wrap;
flex-direction: row-reverse;
align-items: center;
justify-content: space-between;
}
.hy_2023 .section_thanks_contact .appointment .txtblock {
width: calc(100% - 330px);
}
.hy_2023 .section_thanks_contact .appointment .imgblock {
margin: auto 0 -50px;
width: 293px;
}
.hy_2023 .section_thanks_contact .btn_container {
margin-top: 25px;
}
}
.hy_2023 .section_thanks_dl {
border-bottom: 2px dotted #B5B5B6;
}
.hy_2023 .section_thanks_dl .appointment {
border-radius: 1em;
background: #fbecf0;
padding: 20px;
margin: 40px auto 0;
}
.hy_2023 .section_thanks_dl .appointment .imgblock {
margin: 50px auto 0 0;
width: 80%;
}
.hy_2023 .section_thanks_dl .btn_container {
margin-top: 30px;
}
.hy_2023 .section_thanks_dl .btn_container .btn a.link_button {
color: #fff !important;
}
.hy_2023 .section_thanks_dl .btn_container .btn a.link_button::after {
position: relative;
top: auto;
bottom: auto;
right: auto;
display: inline-block;
width: 1.2em;
height: 1em;
transform: none;
border: none;
background-image: url(//help-you.me/wp1/wp-content/themes/hy/img/hy_2023/icon_download_white.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
@media screen and (min-width: 768px) {
.hy_2023 .section_thanks_dl .h1 + p {
font-size: 20px;
text-align: center;
}
.hy_2023 .section_thanks_dl .appointment {
font-size: 20px;
border-radius: 1.5em;
padding: 50px 30px;
display: flex;
flex-wrap: wrap;
flex-direction: row-reverse;
align-items: center;
justify-content: space-between;
}
.hy_2023 .section_thanks_dl .appointment .txtblock {
width: calc(100% - 330px);
}
.hy_2023 .section_thanks_dl .appointment .imgblock {
margin: auto 0 -50px;
width: 293px;
}
.hy_2023 .section_thanks_dl .btn_container {
margin-top: 25px;
}
}
.hy_2023 .section_tokushoho .container {
padding: 0 50px;
max-width: 845px;
}
.hy_2023 .section_tokushoho {
background-color: #ffffff;
}
.hy_2023 .section_tokushoho dl {
max-width: 615px;
margin: -1em auto 0;
}
.hy_2023 .section_tokushoho dl dt {
font-weight: 400;
margin-top: 2em;
}
.hy_2023 .section_tokushoho dl dd {
font-weight: 700;
}
.hy_2023 .section_tokushoho dl dd a {
color: #5E5B55;
}
.hy_2023 .section_tokushoho dl dd ul li {
padding-left: 1em;
}
.hy_2023 .section_tokushoho dl dd ul li::first-letter {
margin-left: -1em;
}
.hy_2023 .section_tokushoho dl dd ul li::before {
content: "・";
}
@media screen and (min-width: 768px) {
.hy_2023 .section_tokushoho dl {
display: flex;
flex-wrap: wrap;
margin: 0 auto 2em;
font-size: 15px;
line-height: 1.5;
}
.hy_2023 .section_tokushoho dl dt {
width: 10em;
margin-top: 2em;
}
.hy_2023 .section_tokushoho dl dd {
width: calc(100% - 10em);
margin-top: 2em;
}
}

.hy_db_form .align-top {
vertical-align: top;
}
.hy_db_form .inline .wpcf7-list-item {
display: inline-block;
margin: 0 2em 10px 0;
}
.hy_db_form input[type="radio"],
.hy_db_form input[type="checkbox"] {
margin-right: 5px;
}