
/* ----------------------------------------------------------------------
	
	エラーページ
	
---------------------------------------------------------------------- */


/* - メイン
--------------------------------------------------*/
.main { margin-top: 30px; }

.main > .grid {
    display: table;
    width: 100%;
}

.main > .grid > .cell {
    display: table-cell;
    vertical-align: top;
}

.main > .grid > .cell.img {
    width: 220px;
    padding-left: 30px;
}

.main > .grid > .cell.img img {
    vertical-align: top;
}


.error_code {
    border-bottom: 1px dashed #ddd;
    padding-bottom: 0.5em;
}
.code_line {
    display: table;
}

.code_line > div {
    display: table-cell;
    vertical-align: middle;
}

.code_line > div.code {
    font-size: 1.3rem;
}

.code_line > div.code > strong {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 2px;
    background-color: #c02;
    color: #fff;
    line-height: 1.4;
}

.code_line > div.cap {
    padding-left: 0.5em;
}

.code_line > div.cap h1 {
    font-weight: bold;
    color: #c02;
    line-height: 1.4;
    font-size: 2.4rem;
}


.result { margin-top: 15px; }
.result > h2 {
    font-size: 3rem;
    line-height: 1.3;
}

/*
.main h1 {
    font-size: 4rem;
    font-weight: bold;
    color: #c02;
    line-height: 1.4;
    
    font-size: 2.4rem;
    margin-top: 5px;
}

.main h2.sub {
    margin-top: 10px;
    font-size: 3rem;
}

.main .code {
    font-size: 1.2rem;
    color: #c02;
}
*/

.main .code > strong {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 2px;
    background-color: #c02;
    color: #fff;
    line-height: 1.2;
}

/*
.main .sub {
    margin-top: 10px;
    font-size: 2rem;
    line-height: 1.3;
}
*/


.comment {
    margin-top: 20px;
    font-size: 1.4rem;
    min-height: 60px;
    
    font-size: 1.5rem;
}
/*
.comment ul.dot_list > li {
    line-height: 1.5;
}
*/

.help_link { margin-top: 15px; }

.help_link > a > .inner {
    display: table;
}

.help_link > a > .inner > .cell.icon {
    padding-right: 0.5em;
}

.help_link > a > .inner > .cell {
    display: table-cell;
    vertical-align: middle;
    line-height: 1.3;
}




/* ------------------------------------------------------------

	939px以下

------------------------------------------------------------ */
@media screen and ( max-width : 939px ) {
    
    #contentsBody {
        padding: 0 30px 40px 30px;
    }
    
}


/* ------------------------------------------------------------

	767px以下

------------------------------------------------------------ */
@media screen and ( max-width : 767px ) {
    
    .main > .grid > .cell.img {
        width: 180px;
        padding-left: 30px;
    }
    
}

/* ------------------------------------------------------------

	639px以下

------------------------------------------------------------ */
@media screen and ( max-width : 639px ) {
    
    .main > .grid { display: block; }
    .main > .grid > .cell { display: block; }
    
    .main > .grid > .cell.img {
        width: auto;
        padding-left: 0;
        text-align: center;
        margin-top: 20px;
    }
    
    .main > .grid > .cell.img img {
        max-width: 120px;
    }
    
    .code_line > div.cap h1 { font-size: 1.8rem; }
    
    .result > h2 { font-size: 2rem; }
    
    .help_link { text-align: center; }
    
}

/* ------------------------------------------------------------

	479px以下

------------------------------------------------------------ */
@media screen and ( max-width : 479px ) {
    
    #contentsBody {
        padding: 0 15px 40px 15px;
    }
    
    .main { margin-top: 15px; }
    
    .main h1 {
        font-size: 3rem;
        font-weight: bold;
        color: #c02;
        line-height: 1.4;
    }
    
    .main .sub {
        font-size: 1.6rem;
    }
    
    .help_link { text-align: center; }
    
    ul.link_list.center.back_link > li > a {
        text-align: center;
    }
    
    
    .help_link > a > .inner > .cell.icon {
        padding-right: 0;
    }
    
    .help_link > a > .inner > .cell.txt {
        font-size: 1.2rem;
        line-height: 1.4;
    }
    
    .help_link > a > .inner > .cell.txt > span {
        display: block;
        font-size: 1.5rem;
    }
}

/* ------------------------------------------------------------

	359px以下

------------------------------------------------------------ */
@media screen and ( max-width : 359px ) {
    
    .help_link > a > .inner > .cell.txt > span {
        display: block;
    }
}

