﻿@charset "UTF-8";
/*******************************************************************************
	サイト名：
	作成会社：Fellow System
--------------------------------------------------------------------------------
 No.│   日付   │区分│						内  容
━━┿━━━━━┿━━┿━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 001│2018.01│新規│[V1.00] 山本
 002|2021.02|追加|[v1.01] 花山
 003|2021.03|追加|[v1.03] 花山
*******************************************************************************/

@font-face {
    font-family: "shokakisararigyoutai";

    src: url(./font/shokakisararigyoutai_1.ttf);
}

@font-face {
    font-family: "Impact";

    src: local("Impact"), url("../fonts/impact.ttf") format("truetype");
}

/*******************************************************************************
	デフォルトセッティング
--------------------------------------------------------------------------------
	適応：全部
*******************************************************************************/
* {
    margin: 0;
    padding: 0;
}

.clearfix:after {
    display: block;
    clear: both;
    content: "";
}
.font-pattern-secondary {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica, Swis, Arial, sans-serif;
}
.wordBreak {
    word-break: break-all;
}

@media print {
    #head {
        display: none;
    }
    #foot {
        display: none;
    }
    #side {
        display: none;
    }
    #sideback {
        display: none;
    }
    #main {
        position: absolute;
        left: -90px;
    }
}

/* 要素指定 */
body {
    margin: auto;
    background-image: url(../image/background.gif);
    background-position: center;
    background-repeat: repeat-y;
    background-color: #ffffff;
    font-style: normal;
    font-weight: normal;
    line-height: 1.6;
    font-family: "游ゴシック", "Yu Gothic","メイリオ", Meiryo;
}

a:link {
    color: #6c6c6c;
    text-decoration: none;
}

a:visited {
    color: #6c6c6c;
    text-decoration: none;
}

a:hover {
    /*background-color: #e5f3f3;*/
    color: #009196;
}

a:active {
    color: #6c6c6c;
}

a img {
    border: 0;
}

img {
    vertical-align: top;
}

#link_page_top {
    border-radius: 5px;
    background: #333;
    opacity: 0.0;
    transition: ease .3s opacity;
}
#link_page_top.view {
    opacity: 1.0;
}

/*******************************************************************************
	共通部
--------------------------------------------------------------------------------
	適応：全部
*******************************************************************************/

/* ヘッダー */
/* div#head h1 {
	float: left;
} */
#head {
    position: relative;
    padding: 16px 12px;
    box-sizing: border-box;
}
.header-title {
    float: left;
}
.header__message {
    margin-bottom: 4px;
    color: #1a1a1a;
    font-weight: bold;
    font-size: 13px;
    line-height: 1.4;
}
.header_message_flex {
    display: flex;
    align-items: center;
}
.header--logo__image {
    margin-top: -2px;
    max-width: 100%;
}
/* .header--nav {
    float: right;
} */
.link-in-header {
    /* margin-right: 30px; */
    font-weight: normal !important;
    font-size: 15px;
    text-decoration: none !important;
}
.header--nav__up {
    display: flex;
    align-items: center;
    margin-top: 16px;
}
.header--nav__bottom {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 16px;
}
.header--nav__bottom__text {
    font-weight: 500;
    font-size: 18px;
}
.header--nav__link {
    display: inline-flex;
    align-items: center;
    color: #393939;
    font-weight: 500;
    font-size: 16px;
}
.header--nav__link__top {
    display: none;
}
/* .header--nav__link + .header--nav__link {
    margin-left: 28px;
} */
.header--nav__icon {
    margin-right: 8px;
}
.header-top-link {
    margin-left: 32px;
}
.header--nav__text {
    display: inline-block;
    max-width: 126px;
    overflow: hidden;
    white-space: nowrap;

    text-overflow: ellipsis;
}
/* .show_english {
    position: absolute;
    right: 13px;
} */
.show_english a {
    display: block;
    width: 93px;
    padding-left: 34px;
    border: 1px solid #707070;
    border-radius: 13px;
    box-sizing: border-box;
    background-image: url(../image/en-logo.png);
    background-position: 9px center;
    background-size: 12px;
    background-repeat: no-repeat;
    background-color: #162BB2;
    color: #ffffff;
    font-size: 11px;
}
.show_english:hover {
    opacity: .8;
}

.tombstone {
    opacity: 0;
    transition: 0.6s;
}

.tombstone.fade-in {
    opacity: 1;
    transition: 0.6s;
}

/* フッター */
div#foot {
    clear: both;
    margin-top: 50px;
    font-size: small;
    text-align: center;
}

div#foot address {
    background-color: #adadad;
    color: #ffffff;
    font-style: normal;
    font-weight: bold;
}
.footer-nav {
    list-style-type: none;
}

/*******************************************************************************
	ヘッダー改修 2022.1207 寺坂
--------------------------------------------------------------------------------
	適応：全部
*******************************************************************************/
.header_logo_flex {
    position: relative;
    display: flex;
}

.header_area {
    position: relative;
    padding: 16px 12px;
    box-sizing: border-box;
}

h1 {
    line-height: 1;
}

.header_logo_image {
    max-width: 147px;
}

.header_message {
    font-size: 13px;
}

.header_text_flex {
    position: relative;
    display: flex;
    align-items: center;
}

.site_type_wrap {
    position: absolute;
    right: 0;
}

.site_type {
    font-size: 50px;
    font-weight: 600;
    color: #293C65;
}

.header_flex_menu {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 46px;
    font-family: "ヒラギノ角ゴシック","遊ゴシック";
    border-top: 1px solid #707070;
    border-bottom: 1px solid #707070;
}

.header_tombstone_wrap {
    position: absolute;
    top: 0;
    right: 0;
}

.show_english_position {
    margin-right: 30px;
}

.delimiter_border {
    position: relative;
    margin: 0 30px;
}

.delimiter_border::before {
    content: "";
    display: inline-block;
    width: 2px;
    height: 24px;
    background-color: #D9D9D9;
    position: absolute;
    top: 0;
    left: -16px;

}

div#head {
    padding: initial !important;
}

.header_logo_message {
    margin-left: 20px;
}
/*******************************************************************************
	ヘッダー追加 2023.3　山川・井原
--------------------------------------------------------------------------------
	適応：全部
*******************************************************************************/
.pc-headerlink {
    margin-top: 10px;
    margin-right: auto;
    margin-left: 20px;
    color: #2B4F27;
}
.to-tombstone {
    font-size: 80%;
}
.tombstone-linkstyle{
    position: fixed;
    bottom: 0;
    left: calc(calc(calc(50% - 400px) + 800px) - 200px);
    z-index: 5;
}

.tombstone-linkstyle.actives {
    position: absolute;
    bottom: calc(0px - 30px);
}

.tombstone-linkstyle a img {
    height: 64px;
    width: 200px;
    /* margin-top: 100px; */
}
.add-link {
    font-weight: bold;
}
#bannar-img {
    transition: 0.1s linear;
}
#bannar-img:hover {
    opacity: 0.8;
}
@media screen and (max-width: 768px) {
    .to-tombstone {
        display: none;
    }
    .pc-headerlink {
        margin-top: 0;
        margin-left: 10%;
    }
    .tombstone-linkstyle a img {
        height:64px;
        max-width: 150px;
        margin-top: 0;
    }
    .add-link a::after{
    content: "へ";
    }
    .tombstone-linkstyle {
        left: 60%;

    }
}
/*******************************************************************************
	サイドバー
*******************************************************************************/

.tel-img {
    border: 2px solid #999999;
}

/*******************************************************************************
	管理画面改修 2022.1210 寺坂
--------------------------------------------------------------------------------
	適応：全部
*******************************************************************************/
.mnt_a:hover {
    background-color: initial;
    color: #009196;
}

/*******************************************************************************
	Module: 汎用部品
--------------------------------------------------------------------------------
	適応：全ページ
*******************************************************************************/
.page-heading {
    padding-bottom: 6px;
    padding-left: 24px;
    border-bottom: 4px double #000000;
    font-weight: bold;
    font-size: 20pt;
    font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
    text-shadow: 1px 1px 2px #808080;
}

.button-round {
    display: block;
    width: 64px;
    height: 64px;
    border: 3px solid #ffffff;
    border-radius: 50%;
    background-color: #cccccc;
    color: #ffffff !important;
    font-weight: bold;
    line-height: 64px;
    text-align: center;
}

/* 商品一覧、詳細メイン共通 */
#catalog div#main div#guide div.tree ul {
    padding-bottom: 17px;
    border-bottom: none;
}

.brd {
    margin: 10px 10px 2px 12px;
    font-size: small;
}

/* 青石メイン共通 */
.aoisi_menu {
    text-align: right;
}

.aoisi_menu h2 {
    color: #267486;
    text-align: left;
}

.aoisi_menu h2 span:nth-child(1) {
    background: black;
}

.aoisi_menu dl {
    font-weight: bold;
}

.aoisi_menu dl dt {
    float: left;
    background-color: #000000;
    color: #ffffff;
}

.aoisi_menu dl dd {
    float: left;
    color: #267486;
}

.aoisi_menu ul {
    list-style: none;
    width: 466px;
    margin: 0 auto;
    text-align: center;
}

.aoisi_menu ul li {
    display: inline-block;
    padding: 0 20px;
}

.aoisi_menu ul li:nth-child(n+2):nth-child(-n+5), .aoisi_menu ul li:nth-child(n+7):nth-child(-n+8) {
    border-left: 1px solid;
}

.aoisi_menu a:link {
    color: #0000ff;
    text-decoration: underline;
}

.aoisi_menu a:visited {
    color: #0000ff;
    text-decoration: underline;
}

.aoisi_menu a:hover {
    background-color: #e5f3f3;
    color: #0000ff;
}

.aoisi_menu a:active {
    color: #0000ff;
}

.pager_list {
    text-align: center;
}
.word-break {
    word-break: break-all;
}
.profile {
    display: flex;
    align-items: center;
}
.profile__logout [class^="door"], .profile__logout[class*=" door"] {
    margin-right: 8px;
}
.profile__logout .doorexit:before {
    font-size: 20px;
}
.not_side {
    justify-content: center;
}
/*******************************************************************************
	トップページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/

div#main div#guide {
    border-width: 1px;
    border-style: solid none solid none;
    border-color: #999999;
}

.h_title {
    font-size: 16px;
}

div#main div#guide div.tree h3 {
    font-size: larger;
}

div#main div#guide div.tree h4 {
    color: #006666;
    font-size: small;
}

div#main div#guide div.tree ul {
    list-style-type: none;
}

div#main div#guide div.tree ul li {
    float: left;
}

/*******************************************************************************
	商品一覧ページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
div#content div.list {
    border-top: #333333 solid 3px;
}

div#content div.list h4 {
    font-weight: normal;
}

div#content div.list ul:last-child {
    list-style-type: none;
}

div#content div.list ul li {
    list-style-type: none;
    float: left;
    font-size: small;
    text-align: center;
    word-break: break-all;
}

div#content div.list dl {
    display:     grid;
    display: -ms-grid;
}

div#content div.list dt {
    float: left;
    clear: left;
    width: 50px;
    text-align: right;

        grid-column: 1;
    -ms-grid-column: 1;
}
div#content div.list dd {
    text-align: left;

        grid-column: 2;
    -ms-grid-column: 2;
}
div#content div.list dt:first-child, div#content div.list dd:first-child {
        grid-row: 1;
    -ms-grid-row: 1;
}
div#content div.list dt:nth-child(3), div#content div.list dd:nth-child(4) {
        grid-row: 2;
    -ms-grid-row: 2;
}
div#content div.list ul:after {
    clear: both;
    content: "";
}
div#content div.list .pages {
    clear: left;
    margin-top: 20px;
    text-align: center;
}
.pg_list {
    margin-top: 20px;
    text-align: center;
}
.cminfo-cell img:first-child {
    max-width: 160px;
    height: 120px;

    object-fit: cover;
}

/*******************************************************************************
	商品詳細ページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
div#content div#detail, div#content div.product-detail-container {
    padding-top: 30px;
    padding-bottom: 30px;
    border-top: #333333 solid 3px;
    border-bottom: 1px #cccccc solid;
}

div#content div#detail p, div#content div.product-detail-container p {
    padding-bottom: 30px;
    text-align: center;
}

.detail_nav {
    height: 25px;
}
.detail_nav .prev {
    float: left;
}
.detail_nav .next {
    float: right;
}

/*******************************************************************************
	新商品案内ページ
--------------------------------------------------------------------------------
	適応：/catalog/new-items.tpl.php
*******************************************************************************/
.products-container {
    padding: 24px 16px;
}
.products-container .button-move-top {
    display: none;
    position: fixed;
    right: 32px;
    bottom: 32px;
}
.button-move-top:visited {
    background-color: #cccccc;
    color: #ffffff;
}
.products-container .product-detail-container {
    border-top: #333333 double 4px;
}
.product-detail-container img {
    width: 100%;
    max-width: 400px;
    transition: .2s ease-in-out;
}
.product-detail-container img:hover {
    opacity: .8;
}
.new-products-container .product-detail-container img {
    max-width: initial;
}
div#content div.product-detail-container .product-info-table {
    margin: 16px auto 32px;
}
.product-detail-container .button-design {
    display: block;
    width: 100%;
    padding: 8px;
    border: 1px solid #999999;
    box-sizing: border-box;
    font-weight: bold;
    font-size: 14pt;
    text-align: center;
    transition-property: all;
    transition-duration: .4s;
    transition-delay: 0s;
}
.product-detail-container .button-design:hover {
    border: 1px solid #666666;
    background-color: #f7f7f7;
    color: #666666;
}

/*******************************************************************************
	青石物語目次ページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
.aoisi_title img {
    display: block;
}

.aoisi_description {
    color: #000066;
}

#mokuji {
    text-align: left;
}

.mokuji_title, .koumoku strong {
    font-size: 120%;
}

/*******************************************************************************
	青石物語本編ページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
.aoisi_history ul {
    list-style: none;
}

.history_title dt, .history_title dd {
    float: left;
}

.history_title dt {
    background-color: #000000;
    color: #ffffff;
}

.history_title dd {
    color: #267486;
}

.aoisi_history h4 {
    border-bottom: #999999 solid 1px;
    font-weight: normal;
}

.page_top {
    text-align: right;
}

.aoisi_map, .aoisi_history p, .aoisi_history ul {
    margin-bottom: 20px;
}

.common_gallery:nth-child(20) li {
    text-align: center;
}
.age {
    padding-right: 16px;
    vertical-align: top;
}

.activity_content {
    text-align: left;
}

.company_koumoku {
    width: 80px;
    vertical-align: top;
}
/*******************************************************************************
	青石施工実績ページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
.back-top {
    float: right;
}

/*******************************************************************************
	青石Q&Aページページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
#main_qa h3 dl dt, #main_qa h3 dl dd {
    float: left;
}

#main_qa ul {
    list-style: none;
    width: 94%;
}

#main_qa ul img {
    margin-right: 13px;
}

.question, .answer {
    display: flex;
    /*	display: grid;
	display: -ms-grid;*/
}

.question {
    margin-bottom: 3px;
}

.answer {
    margin-bottom: 31px;
}

.answer:last-child {
    margin-bottom: 28px;
}

.answer img, .question img {
    display: inline-block;
    height: 26px;
    /*	grid-column: 1;
	-ms-grid-column: 1;*/
}

.question span, .answer span {
    display: inline-block;
    /*	grid-column: 2;
	-ms-grid-column: 2;*/
}

.answer span {
    text-indent: 16px;
}

.address {
    float: right;
    padding-top: 75px;
}

/*******************************************************************************
	お問い合わせページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
#inquiry div#content div#main form p {
    margin-bottom: 3em;
    text-align: center;
}
table#inquiry_form .post_form input:nth-child(1) {
    width: 30%;
    margin-right: 1%;
}

table#inquiry_form .post_form input:nth-child(2) {
    width: 63.5%;
    margin-left: 1%;
}

/*******************************************************************************
	いよせきリンク一覧ページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
.link_list ul {
    list-style: none;
}

.link_list li {
    float: left;
}

.link_list li a:link {
    color: #0000ff;
    text-decoration: underline;
}

.link_list li a:visited {
    color: #0000ff;
    text-decoration: underline;
}

.link_list li a:hover {
    background-color: #e5f3f3;
    color: #0000ff;
}

.link_list li a:active {
    color: #0000ff;
}

.link_list li img {
    border: 1px #e2e2e2 solid;
}

.link_list li span {
    display: block;
    margin-top: 10px;
    font-size: 12px;
    text-align: center;
}

/*******************************************************************************
	いよせき倶楽部ページ共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
.club_list ul {
    list-style: none;
}

.club_list ul li {
    float: left;
}

.club_list ul li span {
    display: block;
    margin: 0 auto;
    text-align: center;
}

/*******************************************************************************
	その他共通部
--------------------------------------------------------------------------------
	適応：メイン
*******************************************************************************/
div#main p.h_newtitle {
    color: #f98f1d;
    font-weight: bold;
}

/* company部 */
#company div#content div.h3 {
    margin-bottom: 50px;
    margin-left: 30px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-top: 1px #888888 dotted;
    background-image: url(../company/image/h3-background.gif);
    background-position: bottom;
    background-repeat: repeat-x;
}

#company div#content div.h3 div.h4 {
    margin-bottom: 20px;
    margin-left: 20px;
    border-bottom: 1px #cccccc solid;
}

#company div#content div.h3 p {
    margin: 10px 20px;
}

#company div#content div.h3 ol {
    margin: 10px 40px;
}

#company div#content div.h3 dl.company {
    margin-bottom: 20px;
    margin-left: 20px;
}

#company div#content div.h3 dl.company dt {
    width: 4em;
}

#company div#content div.h3 dl.company dd {
    margin-top: -1.6em;
    margin-bottom: 1em;
    margin-left: 5em;
}
#company div#content div.h3 dl.company dl dt {
    width: 8em;
}

#company div#content div.h3 dl.company dl dd {
    margin-top: -3.2em;
    margin-bottom: 1em;
    margin-left: 9em;
}

#company div#content div.h3 dl.history {
    width: 400px;
    margin: auto;
    margin-bottom: 20px;
}

#company div#content div.h3 dl.history dt {
    width: 3em;
    padding-left: 5px;
    border-left: 1px #333333 dotted;
}

#company div#content div.h3 dl.history dd {
    margin-top: -1.6em;
    margin-bottom: 1em;
    margin-left: 3em;
    border-right: 1px #333333 dotted;
}

/* topics部 */
div#content div.topics dl {
    padding: 1ex;
    font-size: small;
}

div#content div.topics dl dt {
    width: 9em;
    color: #6c6c6c;
}

div#content div.topics dl dd {
    font-size: small;
}

div#content div.topics dl dd.title {
    margin-top: -1.6em;
    margin-bottom: .5ex;
    margin-left: 10em;
}

div#content div.topics dl dd.article {
    margin-bottom: 1ex;
    margin-left: 10em;
}

div#content p.more {
    font-size: small;
    text-align: right;
}

div#content p.h_title, div#content h2.h_title {
    color: #162BB2;
    font-weight: bold;
}

/* tp_list部 */
.tp_list {
    width: 500px;
    border: #339999 solid 1px;
}

.tp_day {
    color: #339999;
    font-weight: bold;
    /*	width:9em; */
}

.tp_title {
    /*	margin-top:-1.6em;
/*	margin-left:5em;
	margin-bottom:0.5ex;*/
    font-weight: bold;
}

.tp_line {
    border-width: 1px;
    border-style: solid none none none;
    border-color: #339999;
}

.tp_article {
    margin-bottom: 1ex;
    margin-left: 3em;
}

.tp_more {
    margin-bottom: 16px;
    font-size: small;
    text-align: right;
}

.tbl_post-content {
    /*width:98%;1カラムになりンタリングの必要性が出てきため無効化*/
    padding: 1em 5%;
}
.no-mark {
    list-style-type: none;/*標準でついている点をなくす　花山*/
}
/* フリー */
.red {
    color: #ff0000;
    font-size: 1.2em;
}

.lin	/* タイトル：メッセージ：ページ依存 */ {
    margin-top: 5px;
    border-width: 1px;
    border-style: dotted none none none;
    border-color: #d7d4d4;
}

#shop_banner {
    display: block;
    width: 550px;
    height: 150px;
    margin: 15px auto 0;
}

/*******************************************************************************
	カレンダーページ
--------------------------------------------------------------------------------
	適応：calendar/tpl/calendar-2019.tpl.php
*******************************************************************************/
.fudemoji {
    /* font-family: 'shokakisararigyoutai'; */
}
.calendar-table-fudemoji {
    width: 48%;
    min-height: 366px;
    margin: 16px auto;
    border: solid 1px rgba(221, 221, 221, .7);
    border-top: solid 3px #0071bc;
    box-shadow: 3px 3px 3px rgba(0,0,0,.1);
    border-collapse: collapse;
}
.calendar-table-fudemoji:nth-child(odd) {
    float: left;
}
.calendar-table-fudemoji:nth-child(even) {
    float: right;
}
/* .calendar-table-fudemoji .calnder-board {
	background: #0071bc;
	background: -moz-linear-gradient(top, #0071bc 0%, #ffffff 15%, #ffffff 85%, #0071bc 100%);
	background: -webkit-linear-gradient(top, #0071bc 0%,#ffffff 15%,#ffffff 85%,#0071bc 100%);
	background: linear-gradient(to bottom, #0071bc 0%,#ffffff 15%,#ffffff 85%,#0071bc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0071bc', endColorstr='#0071bc',GradientType=0 );
} */
.calendar-table-fudemoji th, .calendar-table-fudemoji td {
    width: 14.28%;
    padding: 2px;
    box-sizing: border-box;
    text-align: center;
}
.calendar-table-fudemoji td {
    height: 3em;
    padding: 2px 4px;
    border: solid 1px rgba(221, 221, 221, .7);
    font-weight: bold;
}

.calendar-table-fudemoji .calnder-board th {
    /* font-family: 'shokakisararigyoutai'; */
    padding-top: 12px;
    padding-bottom: 12px;
    border-right: none;
    border-left: none;
    line-height: 1em;
    vertical-align: middle;
}
.calendar-table-fudemoji .calnder-board th:last-child {
    text-align: left;
}
.calendar-table-fudemoji .calnder-board	.calendar-month-subject {
    font-weight: bold;
    font-size: 21pt;
}

.calendar-table-fudemoji .calendar-weekday {
    background-color: #0071bc;
    color: #ffffff;
    font-size: 8pt;
}

.calendar-table-fudemoji tbody td:last-child {
    color: #0071bc;
}
.calendar-table-fudemoji .calendar-weekday th:first-child, .calendar-table-fudemoji tbody td:first-child, .calendar-table-fudemoji tbody td.holiday, .failure_message {
    color: #ff0000;
}

.calendar-table-fudemoji tbody td {
    vertical-align: top;
}
.calendar-table-fudemoji tbody td .smallfont {
    width: 32px;
    overflow: hidden;
    font-weight: normal;
    font-size: 8pt;
    white-space: nowrap;

    text-overflow: ellipsis;
}
.swal-modal.holiday-dialog .swal-button.swal-button--confirm {
    background-color: #0071bc;
}
.swal-overlay--show-modal .swal-modal {
            animation: none;

    -webkit-animation: none;
}
.swal-text {
    font-size: 18px;
}
/*******************************************************************************
        線
--------------------------------------------------------------------------------
        適応:区切り線
*******************************************************************************/
.border-line-CustomDashed {
    height: 1px;
    background-image: linear-gradient(to right, #999999,#999999 3px, transparent 3px,transparent 6px);
    background-size: 6px 1px;
    background-repeat: repeat-x;
}
.border-line-solid {
    border: 0;
    border-bottom: 1.5px solid #999999;
}
/*******************************************************************************
	ニュースページ
--------------------------------------------------------------------------------
	適応：/topic/tpl/news_dtl.tpl.php
*******************************************************************************/
.newspage-title {
    padding: 0 5%;
}
.imgtable-base {
    width: 100%;
    margin-top: 10px;
    table-layout: fixed;
}

.imgtable-tr {
    justify-content: space-between;
}
.image-frame {
    /*width:-webkit-calc(100%/3);
  width:calc(100%/3);*/
    position: relative;
    margin: 5% auto;
    text-align: center;/*中央揃えにする。花山*/
    vertical-align: middle;
}
/*.image-frame:after{
   content:"";
   padding-top:100%;
   display:block;
}*/
.image-linkParts {
    display: block;
    position: relative;
    width: 100%;
    overflow: hidden;
}
.image-fitParts {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    max-height: 100%;
    /*padding:5% 0%;*/
    box-sizing: border-box;

    object-fit: cover;
    object-position: top;
}
.dummy-image {
    padding: 1% 5%;
    vertical-align: middle;
}

.link-deco {
    margin: 10px 0;
    padding: 5px 15px;
    border-radius: 20px;
    background-color: #009196;
    font-weight: bold;
}
.link-deco:link {
    color: white;
}

.link-deco:active {
    color: white;
}
.link-deco:visited {
    color: white;
}
.link-deco:hover {
    background-color: #e5f3f3;
    color: #009196;
}
/*******************************************************************************
	ニュースページ
--------------------------------------------------------------------------------
	適応：/topic/tpl/index.tpl.php
*******************************************************************************/
.Space10 {
    padding: 10px 10px;
}
.Space10-0 {
    padding: 0 10px 10px;
}
/*******************************************************************************
	霊園詳細ページ
--------------------------------------------------------------------------------
	適応：/topic/tpl/index.tpl.php
*******************************************************************************/

/*******************************************************************************
	ログインページ
--------------------------------------------------------------------------------
	適応：/login/tpl/
*******************************************************************************/
.login_form_frame {
    border: 2px #cccccc solid;
}
.required {
    color: #d80915;
    font-weight: bold;
    font-size: 13px;
    text-align: left;
}
.form_padding {
    width: calc(100% - 20px);
    margin: 24px auto;
    padding: 5%;
    box-sizing: border-box;
    text-align: center;
}
.form_margin {
    margin: 1% 8%;
}
.form_text {
    margin: 16px auto;
}
.text_margin {
    margin-bottom: 16px;
    text-align: center;
}
.form_text .form_left {
    text-align: left;
}
.form_button {
    width: 299px;
    height: 50px;
    margin-top: 2%;
    margin-bottom: 16px;
    padding: .5em;
    border: none;
    background: #1071bc;
    color: #c3dbed;
    font-weight: 900;
    font-size: 17px;
    letter-spacing: .5em;
    text-indent: .5em;
    cursor: pointer;
    transition: all 1s;
}
.form_button:disabled {
    opacity: .1;

    pointer-events: none;
}
.form_button:hover, .form_button:focus {
    border: 2px solid #1071bc;
    background: transparent;
    color: #1071bc;
}
.input_block, .failure_message {
    margin-bottom: 24px;
}
.long_h1_br {
    display: none;
}
a.reapply_link {
    color: #1071bc;
}
/*******************************************************************************
	会員登録ページ
--------------------------------------------------------------------------------
	適応：/plus_membercorp/tpl/
*******************************************************************************/
.click_box, .click_select {
    cursor: pointer;
}
.click_select {
    -webkit-appearance: none;
            appearance: none;
}
.click_select::-ms-expand {
    display: none;
}
.input_max, .input_height {
    /* width: 359px; */
    width: 100%;
    height: 42px;
    padding: 10px 15px 12px 15px;
    /* padding: 10px 17px 12px 17px; */
    border: none;
    box-sizing: border-box;
    background-color: rgba(16,113,188,.1);/*opcityだと文字色まで薄くなってユーザビリティ的によくない*/
    font-weight: normal;
    font-size: 15px;
    /*opacity: 0.1;*/
    text-align: left;
}
input.input_max:read-only, input.input_height:read-only, textarea.input_textarea:read-only {
    background-color: #f0f0f0;
}
.form_box--middle .input_max, .form_box--middle .input_height {
    max-width: 370px;
}
.input_textarea {
    padding: 10px 17px 12px 17px;
    border: none;
    box-sizing: border-box;
    background: rgba(16,113,188,.1);/*opcityだと文字色まで薄くなってユーザビリティ的によくない*/
    font-weight: normal;
    font-size: 15px;
    /*opacity: 0.1;*/
    text-align: left;
}
.input_height::placeholder {
    opacity: .3;
    color: #484848;
}
.tel_input, .post_inputB {
    width: 72px;
}
.post_inputA {
    width: 64px;
}
/* .input_plus_pass {
    width: calc(359px - 42px);
} */
.ratios {
    /*width:50%;*/
    white-space: nowrap;
}
.works {
    width: 263px;
    height: 42px;
    padding: 13px 17px 9px 17px;
    box-sizing: border-box;
    background: #f0f0f0;
    color: #484848;
    font-weight: normal;
    font-size: 15px;
    text-align: left;
}
.ratiosA {
    width: 70%;
}
.ratiosB {
    width: 30%;
}
.ratio_box li {
    display: flex;
    flex-shrink: 0;
    width: 100%;
    margin: 8px 0;
}
.form_table {
    width: 100%;
    /*display: inline-block;*/
    text-align: left;
    border-collapse: separate;
    border-spacing: 0 8px;
}
.form_table th {
    width: 25%;
    min-width: 150px;
    padding-top: 7px;
    color: #484848;
    font-weight: bold;
    font-size: 15px;
    text-align: left;
    vertical-align: top;
}
.form_table th.plus_data_type {
    border-bottom: solid 1px;
    font-size: 18px;
}
.image_td {
    display: flex;
    flex-flow: column;
}
.plus_member_overview {
    padding: 32px 10px 0 10px;
}
.large_red {
    color: #d80915;
    font-weight: normal;
    font-size: 85px;
    font-family: Impact;
    text-align: left;
}
.large_gray {
    color: #393939;
    font-weight: 900;
    font-size: 48px;
    text-align: left;
}
.text_align_center {
    text-align: center;
}
.red_arrow_message {
    margin: 0 30.5px;
    color: #393939;
    font-weight: 900;
    font-size: 32px;
}
.red_arrow_message.sub_heading {
    font-size: 28px;
}
.red_arrow {
    color: red;
    font-weight: bold;
    font-size: 4em;
}
.recommended_box {
    position: relative;
    height: 143px;
    margin: 5% 0;
    padding: 42px 40px;
    background-image: url(../image/iyoseki_plus_membercorp.png);
    background-position: 70% 0;
    background-repeat: no-repeat;
    background-color: #f0f0f0;
    outline: 3px solid;
    outline-color: #808080;

    outline-offset: -8px;
}
.recommended_heading {
    color: #393939;
    font-weight: 900;
    font-size: 24px;
    text-align: left;
}
.red_marker {
    width: 105px;
    height: 35px;
    margin: 5px;
    padding: 5px;
    background: #d80915;
    color: white;
}
.recommended_list {
    margin-top: 22px;
    margin-left: calc(40 / 533 * 100%);
}
.recommended_list li {
    list-style-type: none;
    color: #393939;
    font-weight: normal;
    font-size: 14px;
    line-height: calc(1em + 14px);
    text-align: left;
}.recommended_list li::before {
    display: inline-block;
    position: relative;
    left: -9px;
    width: 10px;
    height: 10px;
    border: solid 1px #707070;
    background-color: #393939;
    content: "";
}
.check_box:before {
    position: absolute;
    transform: translate(56%,-30%) rotate(45deg);
    width: .5em;
    height: 1em;
    border-right: solid 6px;
    border-bottom: solid 6px;
    border-color: #d80000;
    content: "";
}
.check_box {
    display: inline-block;
    position: relative;
    width: 24px;
    height: 23px;
    margin-right: 20px;
    border: 3px solid #707070;
    background: #ffffff;
    vertical-align: middle;
}
.three_benefit {
    display: flex;
    justify-content: center;
    align-items: baseline;
    color: #393939;
    font-weight: 900;
    font-size: 29px;
    font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica, Swis, Arial, sans-serif;
    text-align: center;
}
.width_border_right {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    color: #393939;
    font-weight: bold;
    font-size: 24px;
    text-align: left;
}
.width_border_right:after {
    flex-grow: 1;
    margin-left: 1rem;
    border-top: 1px solid;
    content: "";
}
.corp_plus_ul {
    list-style: none;
}
.annotation-mark {
    display: inline-flex;
    align-items: center;
    float: right;
    margin-right: 10%;
    color: #484848;
    font-weight: bold;
    font-size: 16px;
    cursor: pointer;
}
.annotation-mark__image {
    margin-right: 4px;
    transition: all .3s ease;
}
.annotation-mark__image.active {
    transform: rotate(90deg);
}
.benefit-annotation {
    display: none;
    clear: both;
    margin-top: 8px;
    margin-bottom: 8px;
    padding-right: 40px;
    padding-left: 56px;
    color: #393939;
    font-weight: normal;
    font-size: 16px;
    text-indent: -48px;
}
.benefit-annotation__important {
    font-weight: bold;
    text-decoration: underline;
}
.plus_member_list li {
    padding: .5em;
    border-bottom: 2px solid;
    color: #484848;
    font-weight: bold;
    font-size: 19px;
    text-align: left;
}
.ratio {
    width: 56px;/*XDのサイズだと数値が隠れてしまう。*/
    height: 42px;
    margin-right: 8px;
    margin-left: 17px;
    background: rgba(16,113,188,.1);/*opcityだと文字色まで薄くなってユーザビリティ的によくない*/
    /*width: 43px;*/
    text-align: right;
    /*opacity: 0.1;*/
}
.ratio100 {
    color: #999999;
}
.check_input {
    border: none;
    outline: none;
}
/*矢印を消すcss*/
.notspin::-webkit-inner-spin-button, .nottspin::-webkit-outer-spin-button {
    margin: 0;

    -webkit-appearance: none;
}
.deco_check_box {
    width: 24px;
    height: 24px;
    margin: 9px;
    vertical-align: middle;
}
.flex_box {
    display: flex;
}
.plus_member_image_box::before {
    display: block;
    padding-top: 100%;
    content: "";
}
.plus_member_imageA {
    position: absolute;
    top: 0;
    left: 30%;
    width: 320px;
    height: auto;
}
.plus_member_imageB {
    width: 94.57px;
    height: auto;
    margin: 15.3px;
}
.plus_member_imageC {
    transform: translateY(-20%);
    width: 40px;
    height: auto;
    margin-right: 12px;
}
.inverse_trigonometric {
    display: inline-block;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    /*margin:16px;*/
}
.benefit_heading {
    margin: 0 16px;
}
.sampleimage {
    width: 100%;
    max-width: 350px;
    height: auto;
    padding: 8px;
    box-sizing: border-box;
}
.mbcorp_button {
    width: 90%;
    height: 48px;
    font-size: 16px;
}
.isikoji_heading {
    padding: 8px;
    font-weight: bold;
    font-size: 24px;
    text-align: center;
}
.message-box {
    margin: 64px auto 48px;
}

.message-box__contents {
    margin: 24px auto 32px;
    padding: 24px 32px;
    border: 1px solid #acacac;
    box-shadow: 0 2px 2px rgba(0, 0, 0, .16);
    background-color: #ffffff;
}

.message-box__phrase {
    margin-bottom: 1em;
    font-size: 16px;
    text-align: left;
    /* color: #393939; */
}

.message-box__link-box {
    text-align: right;
}

.message-box__link {
    color: #1071bc;
    font-weight: bold;
    font-size: 18px;
    text-decoration: underline;
}

.message-box__link:link {
    color: #1071bc;
    text-decoration: underline;
}
.construction-info-table {
    margin-top: 48px;
}
.description-textarea {
    width: 100%;
    min-height: 10em;
}
/*******************************************************************************
	問い合わせページ
--------------------------------------------------------------------------------
	適応：/enquiry/tpl
*******************************************************************************/
.long_text_table_cell {
    width: 100%;
    max-width: 60%;
}
.button_padding {
    padding: 0 5%;
    text-align: center;
}
/*******************************************************************************
	商品ページ
--------------------------------------------------------------------------------
	適応：/catalog/tpl
*******************************************************************************/
.enquiry_messa_box {
    margin: 16px auto;
    padding: 16px;
    border: 1px solid #f0f0f0;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .16);
    background-color: #f0f0f0;
    text-align: center;
}
.enquiry_messa {
    color: #006666;
    /* font-size: 24px; */
}

/*******************************************************************************
	会員登録情報ページ
--------------------------------------------------------------------------------
	適応：/mypage/tpl
*******************************************************************************/
/* .display_mypage {
	display: none;
} */
.right_margin {
    margin-right: 8px;
}
.invisible_box {
    display: none;
}
.diagonalline {
    background-image: linear-gradient(to left top,transparent 48%,black 48%,black 52%, transparent 52%);
}

/*******************************************************************************
	追従ボタン 修正
--------------------------------------------------------------------------------
	適応：index.tpl.php
*******************************************************************************/

#home #content {
    position: relative;
}