@charset 'UTF-8';
/* bg */
/* mono tone */

/*====================================================================

lv2.css

======================================================================

01.index

=====================================================================*/
/*--------------------------------------------------------------------/
	01.level
/--------------------------------------------------------------------*/
.contents
{
    padding-bottom: 80px;
    padding-bottom: 5rem;

    background: #000005;
}

.main-view
{
    position: relative;

    overflow: hidden;

    height: 24.16vw;
    min-height: 80px; 

    background: url('../img/common/main_sp.jpg') center center no-repeat;
}
.main-view .l-cont
{
    position: relative;

    display: -ms-flexbox;
    display: flex;

    height: 24.16vw;
    min-height: 80px; 

    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
}
.main-view__tit
{
    font-family: 'Oswald','Noto Sans JP', serif; 
    font-size: calc(1rem + 6 * (100vw - 320px) / 937);
    font-weight: 400;

    color: #f3e900;
}

/* page-navi
----------------------------------------------------------------*/
.page-navi
{
    padding-top: 20px;
    padding-top: 1.25rem;
    padding-bottom: 20px;
    padding-bottom: 1.25rem;
}
.page-navi li
{
    font-size: 11.04px;
    font-size: .69rem;

    display: inline;

    vertical-align: bottom;
}
.page-navi li:not(:last-of-type):after
{
    font-family: 'icomoon' !important;

    margin-right: 3px;
    margin-left: 5px;

    content: '\e315';
    vertical-align: bottom;
}
.page-navi a
{
    transition: .3s ease all; 

    color: #fff;
}
.page-navi a:hover
{
    color: #f3e900;
}

/*--------------------------------------------------------------------/
	article, section
/--------------------------------------------------------------------*/
.l-box
{
    width: 100%;
}
.l-box:not(:last-of-type)
{
    margin-bottom: 64px;
    margin-bottom: 4rem;
}

.sub-box
{
    margin-bottom: 48px;
    margin-bottom: 3rem;
}

p.caution
{
    line-height: 1.4;

    display: block; 

    padding-left: 1em;

    text-indent: -1em;

    color: #df2f2f;
}
p.caution .link
{
    text-indent: 0;
}
p.caution:before
{
    content: '※';
}

/*--------------------------------------------------------------------/
	common
/--------------------------------------------------------------------*/
/* cmt-box */
[class^='cmt-box']
{
    padding: 16px 24px;
    padding: 1rem 1.5rem;

    border: 1px solid;
}

.cmt-box--gray
{
    border-color: #ccc;
}

.cmt-box--red
{
    border-color: #df2f2f;
}

/* common-bnr */
.common-bnr
{
    margin-bottom: 48px;
    margin-bottom: 3rem;
}

/* flex */
/*--------------------------------------------------------------------/
	404
/--------------------------------------------------------------------*/

#page-404 .btn-wrap
{
    max-width: 280px;
    margin-top: 16px;
    margin-top: 1rem;
    margin-right: auto; 
    margin-left: auto;
}

@media print, screen and (min-width: 376px)
{
    /*====================================================================/
	/*------------------iPhone 以上----------------
	/====================================================================*/
    html
    {
        width: 100%;
    }
}

@media print, screen and (min-width: 481px)
{
    /*====================================================================/
	/*------------------タブレットスタイル----------------
	/====================================================================*/
    html
    {
        width: 100%;
    }
    .main-view
    {
        height: 148px;

        background: url('../img/common/main_pc.jpg') 50% center no-repeat;
    }
    .main-view .l-cont
    {
        height: 148px;
    }
    .common-bnr ul
    {
        display: -ms-flexbox;
        display: flex;

        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .common-bnr ul > *
    {
        -ms-flex-preferred-size: 48%;
        flex-basis: 48%;
    }
}

@media print, screen and (min-width: 797px)
{
    /*====================================================================/
	/*-------------------小さいPCスタイル----------------
	/====================================================================*/
    html
    {
        width: 100%;
    }
    .contents
    {
        padding-bottom: 8rem;
    }
    .l-box:not(:last-of-type)
    {
        margin-bottom: 6rem;
    }
    .sub-box
    {
        margin-bottom: 4rem;
    }
    .common-bnr
    {
        margin-bottom: 4rem;
    }
    #page-404 .txt
    {
        text-align: center;
    }
}

@media print, screen and (min-width: 1057px)
{
    /*====================================================================/
	/*-------------------PCスタイル-------------------
	/====================================================================*/
    html
    {
        width: 100%;
    }
    .main-view__tit
    {
        font-size: 1.5rem;
    }
}

@media print, screen and (min-width: 1920px)
{
    /*====================================================================/
	/*-------------------full PCスタイル-------------------
	/====================================================================*/
    html
    {
        width: 100%;
    }
    .main-view
    {
        background: url('../img/common/main_pc.jpg') 50% center/cover no-repeat;
    }
}

@media screen and (max-width: 1056px)
{
    /*====================================================================/
	/*------------------PC以下---------
	/====================================================================*/
    html
    {
        width: 100%;
    }
}

@media screen and (max-width: 796px)
{
    /*====================================================================/
	/*------------------スマホタブレット共通スタイル---------
	/====================================================================*/
    html
    {
        width: 100%;
    }
}

@media screen and (max-width: 480px)
{
    /*====================================================================/
	/*------------------スマホのみスタイル----------------
	/====================================================================*/
    html
    {
        width: 100%;
    }
    .common-bnr ul > *:first-child
    {
        margin-bottom: 1rem;
    }
}

@media screen and (max-width: 375px)
{
    /*====================================================================/
	/*------------------iPhone 以下----------------
	/====================================================================*/
    html
    {
        width: 100%;
    }
}