@charset "UTF-8";
/*--------------------------------------------------
global-header
--------------------------------------------------*/
.global-header {
position: relative;
z-index: 9999;
}
.global-header_bar {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-line-pack: center;
align-content: center;
width: 100%;
height: 120px;
padding-left: 40px;
line-height: 1;
background-color: #fff;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
}
.global-header_bar_item {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
gap: 20px 30px;
margin-right: 50px;
}
.global-header_bar_navigation {
width: 100%;
letter-spacing: 0.04em;
}
.global-header_bar_navigation_list {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
width: 100%;
}
.global-header_bar_navigation_item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.global-header_bar_navigation_item:not(:last-child)::after {
content: "/";
margin: 0 15px;
}
.global-header_bar_navigation_link:hover, .global-header_bar_navigation_link.is-current {
color: #62a9e3;
}
.global-header_bar_button {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 120px;
height: 100%;
color: #fff;
font-size: 1.8rem;
letter-spacing: 0.02em;
background: linear-gradient(45deg, #f4d1a1, #f39b24);
position: relative;
z-index: 0;
}
.global-header_bar_button::after {
opacity: 0;
content: "";
width: 100%;
height: 100%;
background: linear-gradient(45deg, #62a9e3, #1e2c7f);
position: absolute;
top: 0;
left: 0;
z-index: -1;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.global-header_bar_button:hover::after {
opacity: 1;
}
.global-header_bar_button img {
width: 30px;
margin: 0 0 12px;
}
.global-header_main-visual {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
width: 100%;
height: max(540px, 42.1875vw);
padding: 0 0 8.59375%;
margin: 120px 0 0;
position: relative;
z-index: 0;
}
.global-header_main-visual::after {
content: "";
width: 100%;
height: 100%;
background: url(../images/top/global-header_main-visual_shape.png) no-repeat left/contain;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.global-header_main-visual_title {
width: 620px;
margin-left: calc(50% - 540px);
}
.global-header_main-visual_slider {
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.global-header_main-visual_slider,
.global-header_main-visual .bx-wrapper,
.global-header_main-visual .bx-viewport, .global-header_main-visual_item, .global-header_main-visual_figure, .global-header_main-visual_image {
width: 100% !important;
height: 100% !important;
}
.global-header_sub-visual {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 100%;
height: 380px;
margin: 120px 0 0;
position: relative;
z-index: 0;
overflow: hidden;
}
.global-header_sub-visual::before {
content: "";
width: 100%;
height: 100%;
background: url(../images/common/global-header_sub-visual_shape.png) no-repeat left/contain;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.global-header_sub-visual::after {
opacity: 0.3;
content: attr(data-label);
line-height: 1;
color: #fff;
font-size: 12rem;
font-weight: 900;
font-family: "Arial", "メイリオ";
text-transform: uppercase;
position: absolute;
bottom: -0.11em;
left: 5.46875%;
z-index: -1;
}
.global-header_sub-visual_title {
margin-left: calc(50% - 540px);
padding: 0 15px;
line-height: 1.2878787879;
color: #fff;
font-size: 6.6rem;
font-weight: 400;
font-family: "Makinas", "Noto Sans JP", sans-serif;
letter-spacing: 0.12em;
background: url(../images/common/global-header_sub-visual_title_bg.png) no-repeat left;
position: relative;
z-index: 0;
}
.global-header_sub-visual_title::before {
content: "";
width: 100%;
height: 48px;
background: url(../images/common/global-header_sub-visual_title_shape.png) no-repeat center/contain;
position: absolute;
top: -24px;
left: 0;
z-index: -1;
}
.global-header_sub-visual_figure, .global-header_sub-visual_image {
width: 100%;
height: 100%;
}
.global-header_sub-visual_figure {
position: absolute;
top: 0;
left: 0;
z-index: -10;
}
/*--------------------------------------------------
greeting
--------------------------------------------------*/
.greeting {
background: url(../images/top/greeting/greeting_bg.png) no-repeat center/cover;
}
.greeting_title {
margin: 0 0 45px;
text-align: center;
font-size: 3.5rem;
}
.greeting_title_en {
margin: 0 0 -10px;
color: #fff;
font-size: 171.4285714286%;
font-weight: 900;
font-family: "Arial", "メイリオ";
font-style: italic;
letter-spacing: 0;
position: relative;
z-index: 0;
}
.greeting_title_en::before {
content: attr(data-title);
position: absolute;
top: 0;
right: 0;
left: 0;
background: -webkit-gradient(linear, left bottom, left top, from(#2e66e0), to(#00b7e8));
background: linear-gradient(0deg, #2e66e0, #00b7e8);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
-webkit-transform: translate(-2px, -2px);
transform: translate(-2px, -2px);
z-index: 99;
}
.greeting_title_ja {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.greeting_title_ja::before, .greeting_title_ja::after {
content: "";
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
height: 1px;
margin-right: 55px;
background-color: #1e2c7f;
}
.greeting_title_ja::after {
margin-right: 0;
margin-left: 55px;
}
.greeting_text {
margin: 0 0 50px;
text-align: center;
text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
}
.greeting_link {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 10px;
line-height: 2;
}
.greeting_link_item {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
width: 478px;
height: 160px;
padding: 5px;
color: #fff;
font-size: 3rem;
font-weight: 700;
letter-spacing: 0.06em;
text-shadow: 0 0 5px #222;
}
.greeting_link_item:hover {
opacity: 0.8;
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
.greeting_link_item01 {
padding-left: 55px;
background: url(../images/top/greeting/greeting_link_bg01.png) no-repeat center/cover;
}
.greeting_link_item02 {
padding-left: 85px;
background: url(../images/top/greeting/greeting_link_bg02.png) no-repeat center/cover;
}
.greeting_link_title {
position: relative;
z-index: 0;
}
.greeting_link_title::after {
content: "";
width: 252px;
height: 19px;
background: url(../images/top/greeting/greeting_link_title_arrow.png) no-repeat center/contain;
position: absolute;
bottom: 0;
left: 0;
z-index: -1;
}
/*--------------------------------------------------
page-link
--------------------------------------------------*/
.page-link_item {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 50%;
aspect-ratio: 12/5;
position: relative;
z-index: 0;
overflow: hidden;
}
.page-link_item::before, .page-link_item::after {
content: "";
position: absolute;
z-index: -1;
}
.page-link_item::before {
width: 100%;
height: 100%;
background: url(../images/top/page-link/page-link_item_shape.png) no-repeat left/contain;
bottom: 0;
left: 0;
}
.page-link_item::after {
width: calc(100% - 40px);
height: calc(100% - 40px);
margin: auto;
border: 1px solid #fff;
background-color: rgba(255, 255, 255, 0.3);
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: -10;
}
.page-link_item:nth-child(even)::before {
-webkit-transform: scale(-1, -1);
transform: scale(-1, -1);
}
.page-link_title {
font-size: 3.5rem;
text-align: center;
}
.page-link_title_en {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin: 0 0 10px;
line-height: 1.25;
color: #fff;
font-size: 114.2857142857%;
font-weight: 900;
font-family: "Arial", "メイリオ";
letter-spacing: 0;
background: url(../images/common/pattern01.png) repeat;
}
.page-link_title_en::before, .page-link_title_en::after {
content: "";
width: 50px;
height: 1px;
margin-right: 25px;
background-color: #fff;
}
.page-link_title_en::after {
margin-right: 0;
margin-left: 25px;
}
.page-link_item:nth-child(even) .page-link_title_en {
background-image: url(../images/common/pattern02.png);
}
.page-link_figure {
position: absolute;
top: 0;
left: 0;
z-index: -999;
}
.page-link_figure, .page-link_image {
width: 100%;
height: 100%;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.page-link_item:hover .page-link_image {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/*--------------------------------------------------
contact-banner
--------------------------------------------------*/
.contact-banner {
background: url(../images/top/contact-banner/contact-banner_bg.png) no-repeat center/cover;
}
.contact-banner_title {
margin: 0 0 60px;
color: #fff;
font-size: 3.5rem;
text-align: center;
}
.contact-banner_title_en {
margin: 0 0 -45px;
line-height: 1;
font-size: 342.8571428571%;
font-style: italic;
font-weight: 900;
font-family: "Arial", "メイリオ";
letter-spacing: 0;
background: -webkit-gradient(linear, left bottom, left top, from(#1758a3), to(#54c6ea));
background: linear-gradient(0deg, #1758a3 0%, #54c6ea 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
}
.contact-banner_title_ja {
text-shadow: 0 0 10px rgba(50, 109, 176, 0.5);
position: relative;
z-index: 999;
}
.contact-banner_list_item {
width: 340px;
height: 160px;
}
.contact-banner_list_link {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 100%;
height: 100%;
padding: 0 40px;
outline-offset: -6px;
outline: 1px solid;
background-color: #fff;
position: relative;
z-index: 0;
}
.contact-banner_list_link::before {
content: "";
width: 100%;
height: 44px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
position: absolute;
top: -16px;
left: 0;
z-index: 99;
pointer-events: none;
}
.contact-banner_list_link:hover {
opacity: 0.8;
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
.contact-banner_list_item:nth-child(1) .contact-banner_list_link {
outline-color: #62a9e3;
}
.contact-banner_list_item:nth-child(1) .contact-banner_list_link::before {
background-image: url(../images/top/contact-banner/contact-banner_list_item_icon01.png);
}
.contact-banner_list_item:nth-child(2) .contact-banner_list_link {
outline-color: #f39b24;
}
.contact-banner_list_item:nth-child(2) .contact-banner_list_link::before {
background-image: url(../images/top/contact-banner/contact-banner_list_item_icon02.png);
}
.contact-banner_list_item:nth-child(3) .contact-banner_list_link {
outline-color: #1e2c7f;
}
.contact-banner_list_item:nth-child(3) .contact-banner_list_link::before {
background-image: url(../images/top/contact-banner/contact-banner_list_item_icon03.png);
}
.contact-banner_list_title {
width: 100%;
margin: 0 0 10px;
padding: 0 0 5px;
color: #1e2c7f;
font-size: 2rem;
text-align: center;
letter-spacing: 0.06em;
border-bottom: 1px solid #c7c7c7;
}
.contact-banner_list_tel {
height: auto;
line-height: 1;
font-size: 3.6rem;
font-weight: 700;
white-space: nowrap;
}
.contact-banner_list_button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 100%;
height: 35px;
color: #fff;
font-size: 93.75%;
background: -webkit-gradient(linear, left bottom, left top, from(#f39b24), color-stop(50%, #f6b154));
background: linear-gradient(0deg, #f39b24 0%, #f6b154 50%);
position: relative;
z-index: 0;
}
.contact-banner_list_button::after {
content: "";
width: 10px;
aspect-ratio: 1/1;
background-color: #fff;
-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
clip-path: polygon(100% 0, 0% 100%, 100% 100%);
position: absolute;
right: 2px;
bottom: 2px;
z-index: -1;
}
.contact-banner_list_button_color-blue {
background: -webkit-gradient(linear, left bottom, left top, from(#222e8c), to(#54c6ea));
background: linear-gradient(0deg, #222e8c 0%, #54c6ea 100%);
}
/*--------------------------------------------------
news-top
--------------------------------------------------*/
.news-top {
position: relative;
z-index: 0;
overflow: hidden;
}
.news-top::after {
content: "";
width: 850px;
height: 100%;
background-color: #ecf6ff;
-webkit-clip-path: polygon(0 0, 0% 100%, 100% 0);
clip-path: polygon(0 0, 0% 100%, 100% 0);
position: absolute;
top: -1px;
left: 0;
z-index: -1;
}
.news-top_wrapper {
position: relative;
z-index: 0;
}
.news-top_title {
font-size: 2.5rem;
font-weight: 700;
}
.news-top_title_en {
line-height: 1;
color: #1e2c7f;
font-size: 180%;
font-weight: 900;
font-family: "Arial", "メイリオ";
letter-spacing: 0;
}
.news-top_list {
width: 690px;
min-height: 215px;
}
.news-top_button {
position: absolute;
bottom: 0;
left: 0;
z-index: 999;
}
/*--------------------------------------------------
welding
--------------------------------------------------*/
.welding {
background: url(../images/welding/welding_bg.png) no-repeat center/cover;
}
.welding_list {
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
gap: 40px 0;
}
.welding_list_item {
width: 520px;
padding: 45px 0;
color: #fff;
outline-offset: -6px;
outline: 1px solid #fff;
background: url(../images/welding/welding_list_item_bg.png) no-repeat right bottom;
background-color: #1e2c7f;
}
.welding_list_item_size-large {
width: 100%;
padding-inline: 160px;
}
.welding_list_title {
margin: 0 0 22px;
padding: 0 0 15px;
color: #fff;
font-size: 2.5rem;
text-align: center;
letter-spacing: 0.06em;
background: -webkit-gradient(linear, left top, right top, from(#fff), to(#fff)) no-repeat bottom/50px 1px;
background: linear-gradient(90deg, #fff, #fff) no-repeat bottom/50px 1px;
}
.welding_list_sub-list {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 8px 35px;
line-height: 1.5;
font-size: 2rem;
font-weight: 500;
}
.welding_list_sub-list_item {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.welding_list_sub-list_item::before {
-ms-flex-negative: 0;
flex-shrink: 0;
content: "";
width: 14px;
aspect-ratio: 1/1;
margin-right: 10px;
background: url(../images/common/icon_check.png) no-repeat center/contain;
}
.welding_list_item_size-large .welding_list_title {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
background-size: 100% 1px;
}
.welding_list_item_size-large .welding_list_title::before, .welding_list_item_size-large .welding_list_title::after {
-ms-flex-negative: 0;
flex-shrink: 0;
content: "";
width: 25px;
height: 22px;
margin-right: 10px;
background: url(../images/common/icon_note.png) no-repeat center/contain;
}
.welding_list_item_size-large .welding_list_title::after {
margin-right: 0;
margin-left: 10px;
}
.welding-type {
background-color: #ecf6ff;
position: relative;
z-index: 0;
}
.welding-type::before, .welding-type::after {
content: "";
width: 100%;
min-height: 1097px;
background: url(../images/welding/welding-type_bg.png) no-repeat top/cover;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.welding-type::after {
top: auto;
bottom: 0;
-webkit-transform: scale(-1, -1);
transform: scale(-1, -1);
}
.welding-type_content_item:not(:last-child) {
margin-bottom: 90px;
}
.welding-type_content_title {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 100%;
margin: 0 0 50px;
color: #fff;
line-height: 2;
font-size: 2.5rem;
background: url(../images/welding/welding-type_content_title_bg.png) no-repeat center/cover;
}
.welding-type_content_title::before, .welding-type_content_title::after {
content: "";
width: 50px;
height: 1px;
margin-right: 35px;
background-color: #fff;
}
.welding-type_content_title::after {
margin-right: 0;
margin-left: 35px;
}
.welding-type_content_figure {
width: 100%;
margin: 0 0 40px;
text-align: center;
}
.welding-type_content_text {
text-align: center;
}
.welding-possible {
position: relative;
z-index: 0;
}
.welding-possible::before {
content: "";
width: 100%;
height: 468px;
background: url(../images/welding/welding-possible_bg.png) no-repeat top/cover;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.welding-possible_title {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin: 0 0 40px;
font-size: 3.5rem;
}
.welding-possible_title::before, .welding-possible_title::after {
content: "";
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
height: 1px;
margin-right: 30px;
background-color: #222;
}
.welding-possible_title::after {
margin-right: 0;
margin-left: 30px;
}
.welding-possible_item {
padding-inline: 0;
}
.welding-possible_text {
width: 100%;
margin: 20px 0 0;
font-size: 1.3rem;
}
.welding-possible_text_item {
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.welding-possible_text_item::before {
content: "※";
}
/*--------------------------------------------------
polishing
--------------------------------------------------*/
.polishing {
background: url(../images/polishing/polishing_bg.png) no-repeat center/cover;
}
.polishing_figure {
margin: 0 0 40px;
text-align: center;
}
.polishing_text {
margin: 0 0 90px;
text-align: center;
}
.polishing_text_under-line {
padding: 0 0 5px;
color: #1e2c7f;
border-bottom: 1px dashed #c7c7c7;
}
.polishing_list_item {
min-height: 220px;
letter-spacing: 0.04em;
position: relative;
z-index: 0;
}
.polishing_list_item:not(:last-child) {
margin-bottom: 50px;
}
.polishing_list_text-box {
width: 595px;
}
.polishing_list_title {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
margin: 0 0 30px;
font-size: 3rem;
background-repeat: no-repeat;
background-position: bottom right;
background-size: calc(100% - 80px) 1px;
background-image: -webkit-gradient(linear, left top, right top, from(#62a9e3), to(#62a9e3));
background-image: linear-gradient(90deg, #62a9e3, #62a9e3);
}
.polishing_list_title::before {
-ms-flex-negative: 0;
flex-shrink: 0;
content: "";
width: 80px;
height: 70px;
margin-right: 20px;
background: url(../images/polishing/polishing_list_title_number01.png) no-repeat center/contain;
}
.polishing_list_item:nth-child(2) .polishing_list_title::before {
background-image: url(../images/polishing/polishing_list_title_number02.png);
}
.polishing_list_item:nth-child(3) .polishing_list_title::before {
background-image: url(../images/polishing/polishing_list_title_number03.png);
}
.polishing_list_figure {
position: absolute;
top: 0;
right: 0;
z-index: 0;
}
.polishing_list_item_fix {
min-height: 300px;
}
.polishing_list_item_fix .polishing_list_text-box {
width: 680px;
}
/*--------------------------------------------------
business
--------------------------------------------------*/
.business_title {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin: 0 0 50px;
font-size: 4rem;
letter-spacing: 0.08em;
text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 20px #fff, 0 0 20px #fff, 0 0 20px #fff;
}
.business_title::before, .business_title::after {
content: "";
width: 30px;
aspect-ratio: 1/1;
margin-right: 30px;
background: url(../images/business/business_title_shape.png) no-repeat center/contain;
}
.business_title::after {
margin-right: 0;
margin-left: 30px;
-webkit-transform: scale(-1, 1);
transform: scale(-1, 1);
}
.business_title_font-blue {
color: #1e2c7f;
}
.business_list {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 30px;
margin: 0 0 30px;
}
.business_list_item {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 340px;
height: 70px;
font-size: 2rem;
font-weight: 700;
letter-spacing: 0.04em;
border-radius: 10px;
border: 1px solid #595a5a;
background-color: #fff;
}
.business_list_item_size-medium {
width: 430px;
}
.business_list_item_size-large {
width: 510px;
}
.business_list_item::before {
content: "";
width: 25px;
aspect-ratio: 1/1;
margin-right: 10px;
background: url(../images/common/icon_check_blue.png) no-repeat center/contain;
}
.business_icon {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 25px;
margin: 0 0 50px;
padding: 0 0 80px;
position: relative;
z-index: 0;
}
.business_icon::after {
content: "";
width: 50px;
height: 30px;
margin: auto;
background-color: #f39b24;
-webkit-clip-path: polygon(0 0, 50% 100%, 100% 0);
clip-path: polygon(0 0, 50% 100%, 100% 0);
position: absolute;
right: 0;
bottom: 0;
left: 0;
z-index: -1;
}
.business_icon_item {
width: 107px;
}
.business_box_title {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin: 0 0 50px;
font-size: 3.5rem;
letter-spacing: 0.08em;
text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 20px #fff, 0 0 20px #fff, 0 0 20px #fff;
}
.business_box_title::before, .business_box_title::after {
content: "";
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
height: 1px;
margin-right: 45px;
background-color: #1e2c7f;
}
.business_box_title::after {
margin-right: 0;
margin-left: 45px;
}
.business_box_list {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 30px;
color: #fff;
font-size: 2.5rem;
font-weight: 700;
letter-spacing: 0.08em;
}
.business_box_list_item {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 340px;
height: 100px;
outline-offset: -6px;
outline: 1px solid #fff;
background-color: #1e2c7f;
position: relative;
z-index: 0;
}
.business_box_list_item::before, .business_box_list_item::after {
content: "";
width: 92px;
height: 75px;
background: url(../images/business/business_box_list_item_shape.png) no-repeat center/contain;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.business_box_list_item::after {
top: auto;
right: 0;
bottom: 0;
left: auto;
-webkit-transform: scale(-1, -1);
transform: scale(-1, -1);
}
.business-links {
padding: 50px 0;
line-height: 1.5;
color: #fff;
font-size: 3rem;
font-weight: 700;
text-shadow: 0 0 10px rgba(30, 44, 127, 0.5), 0 0 10px rgba(30, 44, 127, 0.5);
background-color: #ecf6ff;
}
.business-links_item {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
width: 520px;
height: 160px;
padding: 0 55px;
border: 5px solid #1e2c7f;
background: url(../images/business/business-links_item_bg01.png) no-repeat center/cover;
}
.business-links_item:nth-child(even) {
border-color: #54c6ea;
background-image: url(../images/business/business-links_item_bg02.png);
}
.business-links_item:hover {
opacity: 0.8;
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
.business-links_title {
padding: 0 0 5px;
position: relative;
z-index: 0;
}
.business-links_title::after {
content: "";
width: 252px;
height: 29px;
background: url(../images/business/business-links_title_arrow.png) no-repeat left bottom/contain;
position: absolute;
bottom: 0;
left: 0;
z-index: -1;
}
/*--------------------------------------------------
individual
--------------------------------------------------*/
.individual {
background: url(../images/individual/individual_bg.png) no-repeat center/cover;
}
/*--------------------------------------------------
corporation
--------------------------------------------------*/
.corporation {
background: url(../images/corporation/corporation_bg.png) no-repeat center/cover;
}
/*--------------------------------------------------
works-detail
--------------------------------------------------*/
.works-detail {
padding: 100px 0;
}
.works-detail_content {
padding: 60px;
border: 1px solid #c7c7c7;
}
.works-detail_title {
margin: 0 0 50px;
padding: 16.5px;
color: #fff;
font-size: 2.5rem;
text-align: center;
background-color: #f39b24;
position: relative;
z-index: 0;
}
.works-detail_title::after {
content: "";
width: 100%;
height: 100%;
background-color: #f6b154;
-webkit-clip-path: polygon(0 100%, 100% 100%, 100% 0);
clip-path: polygon(0 100%, 100% 100%, 100% 0);
position: absolute;
right: 0;
bottom: 0;
z-index: -1;
}
.works-detail_figure {
margin: 0 0 50px;
text-align: center;
}
.works-detail_figure_item {
width: 420px;
}
.works-detail_figure_text {
width: 130px;
margin: 0 auto 30px;
line-height: 2;
color: #fff;
font-size: 2rem;
background-color: #145add;
}
.works-detail_figure_image {
width: 100%;
aspect-ratio: 1/1;
}
.works-detail_figure_item:nth-child(even) {
position: relative;
z-index: 0;
}
.works-detail_figure_item:nth-child(even)::before {
content: "";
width: 38px;
height: 65px;
margin: auto;
-webkit-clip-path: polygon(0 100%, 100% 50%, 0 0);
clip-path: polygon(0 100%, 100% 50%, 0 0);
background: linear-gradient(45deg, #145add 0%, #54c6ea 50%);
position: absolute;
top: 0;
bottom: 0;
left: -78px;
z-index: -1;
}
.works-detail_figure_item:nth-child(even) .works-detail_figure_text {
background-color: #54c6ea;
}
.works-detail_text-box_item {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
margin: 0 0 20px;
padding: 5px 15px;
line-height: 2;
font-size: 2rem;
font-weight: 700;
border-top: 1px solid #dbdbdb;
border-bottom: 1px solid #dbdbdb;
}
.works-detail_text-box_item_label {
color: #1e2c7f;
}
.works-detail_text-box_item_label::after {
display: inline-block;
content: ":";
margin: 0 0.5em;
}
.works-detail_text-box_item_text {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
/*--------------------------------------------------
company
--------------------------------------------------*/
.company {
overflow: hidden;
}
.company_table {
padding: 100px 0;
background: url(../images/company/company_bg.png) no-repeat center/cover;
}
.company_table_item {
width: 480px;
margin: 0 auto;
}
.company_table_title, .company_table_text {
padding: 9.5px 0;
vertical-align: middle;
}
.company_table_title {
width: 100px;
color: #1e2c7f;
border-bottom: 1px solid;
}
.company_table_row:first-child .company_table_title {
border-top: 1px solid;
}
.company_table_text {
padding-left: 40px;
}
.company_map {
width: 100%;
height: 500px;
}
.company_map iframe {
width: 100% !important;
height: 100% !important;
}
/*--------------------------------------------------
privacy
--------------------------------------------------*/
.privacy_title {
margin: 0 0 50px;
}
.privacy_content {
padding: 40px;
border: 1px solid #1e2c7f;
}
.privacy_content:not(:last-child) {
margin-bottom: 40px;
}
.privacy_subtitle {
margin: 0 0 15px;
color: #1e2c7f;
font-size: 2.4rem;
}
.privacy_list_item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.privacy_list_item::before {
content: "・";
}
/*--------------------------------------------------
site
--------------------------------------------------*/
.site_list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column wrap;
flex-flow: column wrap;
-ms-flex-line-pack: justify;
align-content: space-between;
height: 440px;
}
.site_list_item {
width: 48%;
border-bottom: 1px solid #222;
}
.site_list_link {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 15px 7px 10px;
position: relative;
}
.site_list_link:hover {
color: #62a9e3;
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
.site_list_link::before {
content: "\f054";
font-size: 1em;
font-weight: 900;
font-family: "Font Awesome 5 Free";
margin-right: 1em;
}
/*--------------------------------------------------
e404
--------------------------------------------------*/
.error {
text-align: center;
}
.error a {
color: #62a9e3;
display: inline;
text-decoration: underline;
}
/*--------------------------------------------------
contact
--------------------------------------------------*/
.contact_table {
width: 100%;
margin: 0 0 40px;
border: 1px solid;
}
.contact_table_row:not(:last-child) .contact_table_title {
border-bottom: 1px solid #fff;
}
.contact_table_row:not(:last-child) .contact_table_text {
border-bottom: 1px solid;
}
.contact_table_title {
width: 360px;
padding: 0 20px;
line-height: 1.5;
color: #fff;
text-align: inherit;
vertical-align: middle;
background-color: #1e2c7f;
-webkit-transition: all 0.5s;
transition: all 0.5s;
}
.contact_table_title [class*=mark] {
line-height: 1.5;
color: #fff;
float: right;
padding: 4px 12px;
font-size: 1.2rem;
border-radius: 16px;
}
.contact_table_title .required-mark {
background-color: #62a9e3;
}
.contact_table_title .arbitrary-mar {
background-color: #15b91b;
}
.contact_table_text {
padding: 20px;
}
.contact_table_text a {
display: inline-block;
color: #62a9e3;
text-decoration: underline;
white-space: nowrap;
}
.contact_table_text div:not(:last-child) {
margin-bottom: 8px;
}
.contact_table_text label {
white-space: nowrap;
}
.contact_table_text input:focus,
.contact_table_text select:focus,
.contact_table_text textarea:focus {
outline: none;
border-color: #222;
}
.contact select,
.contact textarea,
.contact input[type=tel],
.contact input[type=text],
.contact input[type=num],
.contact input[type=email] {
padding: 4px;
border: 1px solid #dadada;
border-radius: 2px;
-webkit-box-shadow: 0 1px 1px rgba(100, 100, 100, 0.1) inset;
box-shadow: 0 1px 1px rgba(100, 100, 100, 0.1) inset;
-webkit-transition: all 0.4s;
transition: all 0.4s;
}
.contact textarea {
display: block;
resize: none;
}
.contact input[type=button],
.contact input[type=submit] {
border: none;
-webkit-appearance: none;
-webkit-transition: all 0.5s;
transition: all 0.5s;
cursor: pointer;
}
.contact input[type=button][disabled],
.contact input[type=submit][disabled] {
background-color: #9a9a9a;
pointer-events: none;
}
.contact input[type=radio],
.contact input[type=checkbox] {
display: inline-block;
margin-right: 6px;
}
.contact input[type=radio] + label,
.contact input[type=checkbox] + label {
position: relative;
display: inline-block;
margin-right: 12px;
line-height: 30px;
cursor: pointer;
}
.contact input[type=radio],
.contact input[type=checkbox] {
display: none;
margin: 0;
}
.contact input[type=radio] + label,
.contact input[type=checkbox] + label {
padding: 0 0 0 24px;
color: inherit;
}
.contact input[type=radio] + label::before,
.contact input[type=checkbox] + label::before {
content: "";
display: block;
width: 18px;
height: 18px;
margin-top: -9px;
background-color: #fff;
position: absolute;
top: 50%;
left: 0;
}
.contact input[type=radio] + label::before {
border: 2px solid #ccc;
border-radius: 30px;
}
.contact input[type=checkbox] + label::before {
border: 2px solid #ccc;
}
.contact input[type=radio]:checked + label::after,
.contact input[type=checkbox]:checked + label::after {
content: "";
display: block;
position: absolute;
top: 50%;
}
.contact input[type=radio]:checked + label::after {
margin-top: -4px;
background: #b91515;
border-radius: 8px;
left: 5px;
width: 8px;
height: 8px;
}
.contact input[type=checkbox]:checked + label::after {
width: 16px;
height: 8px;
margin-top: -8px;
border-left: 3px solid #b91515;
border-bottom: 3px solid #b91515;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
left: 3px;
}
.contact input[name="items[address]"] {
margin-top: 8px;
}
.contact .sec-error-text {
line-height: 80px;
text-align: center;
color: #fff;
font-size: 20px;
background: #3f955b;
}
.contact .error-text {
margin: 0 0 4px;
color: #b91515;
}
.contact_submits {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.contact_button {
max-width: 230px;
margin: 0;
padding: 0;
overflow: hidden;
}
.contact_button + .contact_button {
margin-left: 4%;
}
.contact_button input {
width: 100%;
height: 100%;
background: transparent;
}
.contact_recaptcha {
margin: 0 0 20px;
overflow: hidden;
}
.contact_recaptcha .g-recaptcha {
width: 304px;
margin: auto;
}
.contact_text-box {
text-align: center;
}
.contact select,
.contact textarea,
.contact input[type=tel],
.contact input[type=text],
.contact input[type=email] {
width: 100%;
}
.contact input[type=num] {
width: 70px;
}
.contact textarea {
min-height: 230px;
}
.contact .upload-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
gap: 2%;
}
.contact .upload-item-wrap {
width: 32%;
font-size: 1.2rem;
overflow: hidden;
}
.contact .upload-item input[type=file] {
display: none;
}
.contact .upload-item .thumb {
width: 100%;
aspect-ratio: 1/1;
margin: 0 0 10px;
position: relative;
overflow: hidden;
}
.contact .upload-item img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.contact .upload-item img.thumb {
width: 32%;
margin: 0;
}
.contact .upload-item .ancion-btn-wrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
width: 100%;
}
.contact .upload-item .ancion-btn {
display: block;
width: 48%;
line-height: 35px;
color: #fff;
text-align: center;
letter-spacing: 0;
border-radius: 4px;
background: #e6e6e6;
}
.contact .upload-item .ancion-btn + .contact .upload-item .ancion-btn {
margin-top: 10px;
}
.contact .upload-item .ancion-btn:hover {
cursor: pointer;
}
.contact .upload-item .select-file {
background: #2ecc71;
}
.contact .upload-item .deselect-file {
background: #e74c3c;
}
.contact .upload-item-attention {
width: 100%;
font-size: 1.4rem;
}
.contact .upload-item-attention_item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
}
.contact .upload-item-attention_item::before {
content: "※";
margin-right: 5px;
}
/*--------------------------------------------------
global-footer
--------------------------------------------------*/
.global-footer {
background-color: #f6f6f6;
}
.global-footer_wrapper {
padding: 60px 0 30px;
}
.global-footer_item {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.global-footer_address {
margin-left: 25px;
padding-left: 25px;
line-height: 2.5;
border-left: 2px solid #dbdbdb;
}
.global-footer_list {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin: 30px 0 20px;
padding: 12.5px 0;
line-height: 2;
color: #838383;
font-size: 1.4rem;
border-top: 1px solid;
border-bottom: 1px solid;
}
.global-footer_list_item:not(:last-child) {
margin-right: 35px;
}
.global-footer_list_link:hover {
color: #62a9e3;
}
.global-footer_info {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 0 25px;
}
.global-footer_copyright {
padding: 2.5px;
color: #fff;
text-align: center;
letter-spacing: 0.06em;
background: -webkit-gradient(linear, left bottom, left top, from(#145add), to(#54c6ea));
background: linear-gradient(0deg, #145add, #54c6ea);
}
.global-footer_copyright a {
display: inline-block;
}