@charset "utf-8";

/*

************************************************************************

 問い合わせバナー

************************************************************************

*/

.inquiry-banner

{

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    align-content: center;



	padding:0.5em calc(0.5em + var(--border-radius) / 4);

	border-radius:var(--border-radius);

	border:1px solid var(--body-frame-color);

}

.inquiry-banner > .profile

{

    flex:0 0 50%;

    padding:0.5em;

}

.inquiry-banner > .profile > .sub

{

    display:inline-block;

    line-height:1;

    font-size: 0.8em;

    padding:0.5em;



	border-radius:calc(var(--border-radius) * 0.7);

	border:1px solid var(--accent-frame-color);

    background-color: var(--accent-background-color);

    color:var(--accent-font-color);

    margin-bottom:0.25em;

}

.inquiry-banner > .profile > .name

{

    font-size: 1.4em;

    font-weight: bold;

}

.inquiry-banner > .profile > .notice

{

    font-size: 0.8em;

    color:var(--body-font-color-light)

}

.inquiry-banner > .contact

{

    flex:0 0 50%;

    padding:0.5em;



    display: flex;

    flex-wrap: wrap;

    align-items: center;

    align-content: center;

}

.inquiry-banner > .contact > .main,

.inquiry-banner > .contact > .sub

{

    display: flex;

    align-items: center;

    align-content: center;



    margin:0.25em;

    line-height: 1;

}

.inquiry-banner > .contact > .main

{

    flex:0 0 100%; 

}

.inquiry-banner > .contact > .main > i

{

    font-size: 1.4em !important;

    color:var(--body-icon-color);

    margin-right: 0.25em;

}

.inquiry-banner > .contact > .main > .label

{

    font-size: 1.8em;

    font-weight: bold;

}

.inquiry-banner > .contact > .sub > i

{

    font-size: 1.4em !important;

    color:var(--body-icon-color);

    margin-right: 0.25em;

}

.inquiry-banner > .contact > .sub > .label

{

    font-size: 1.0em;

}

.inquiry-banner > .contact > .main > a:hover,

.inquiry-banner > .contact > .sub > a:hover

{

    text-decoration: underline;

}

.inquiry-banner.inquiry-banner-middle > .profile

{

    flex:0 0 100%;

    padding:0.5em;

}

.inquiry-banner.inquiry-banner-middle > .contact

{

    flex:0 0 100%;

    padding:0.5em;

}



/* ################################################################################################ */

/* ## TAB                        ################################################################## */

/* ################################################################################################ */

@media screen and (max-width:1040px) {

}



/* ################################################################################################ */

/* ## スマホサイト用スタイル ###################################################################### */

/* ################################################################################################ */

@media screen and (max-width:640px) {

    .inquiry-banner > .profile

    {

        flex:0 0 100%;

        padding:0.5em;

    }

    .inquiry-banner > .contact

    {

        flex:0 0 100%;

        padding:0.5em;

    }

}