/* カスタマイズ用CSS */

/* display */
.display_AFS01{ display: block; }
.display_AFS02{ display: none; }
@media screen and (max-width: 769px){
    .display_AFS01{ display: none; }
    .display_AFS02{ display: block; } }

img{
    max-width: 100%; height: auto; width /***/:auto; }

#copyright_AFS{
    font-size: 0.7rem; text-align: center; font-family: Verdana, “Droid Sans”; }
#copyright_AFS a{
    color: #ffffff; }

.clear{
    clear: both; }
.box_inner{
    -webkit-text-size-adjust: 100%;
    width: 100%; max-width: 1220px; }
.box_center{
    margin-right: auto; margin-left: auto; }
.box_inner_center{
    position: relative; align-items: center; display: flex;
    justify-content: center; text-align: justify; }
.a_Black a{ color: #000000;}
.a_white a{ color: #ffffff;}




/* site-description */
.site-description{
    width:100%; color: #ffffff; background: #cc0000; font-size: 0.9em; font-weight: normal;
    padding:3px 0px 1px 0px; margin: 0px; }
    .site-description-box{ max-width: 1220px; margin-right: auto; margin-left: auto; }
    .site-description-box a{ color:#ffffff;}
@media screen and (max-width: 769px){
    .site-description{ display: none; } }

/* wrap */    
.wrap {
    display: -webkit-box; display: -moz-box; display: -ms-flexbox;
    display: -webkit-flex; display: flex; }
@media screen and (max-width: 769px){
    .wrap{ display:block; } }
    
/* background */
body{background-image: url("/html/user_data/image/main_bg.png"); }
.ec-layoutRole{background-image: url("/html/user_data/image/main_bg.png"); }
    
/* common */
.line01{ 
    height: 10px; background-image: url(/html/user_data/image/icon_line01.png);
    margin: 10px auto 0px auto;}

/* space */
.spc_01{ padding-bottom: 20px;}
.spc_02{ padding-bottom: 30px;}
.spc_03{ padding-bottom: 70px;}
.spc_04{ margin-bottom: 20px;}
.spc_05{ margin-top:30px;}
.spc_06{ margin-bottom: 10px;}

/* layout */
.layout_img{ line-height: 0em; }

.spc_01s{ padding: 0 0 20px 0 ;}
@media screen and (max-width: 769px){
    .spc_01s{ padding: 0 10px 20px 10px;} }


/* BOX */
.box_02a{ 
    float: left; margin-bottom: 15px; width: calc((100% - 20px) / 2); }
    .box_02a:nth-child(2n){ margin-left: 20px; }
    .box_02a p{ font-size:1.1em; padding-top:5px; }
@media screen and (max-width: 769px){
    .box_02a{ width:100%;}
    .box_02a:nth-child(1){ padding: 0px 10px; text-align:center;}
    .box_02a:nth-child(2){ padding: 0px 10px; margin-left: 0px; text-align:center;} }

.box_03a{ width: calc(100% / 3); }
  .box_03a:nth-child(1){ padding: 0 10px 0 0; }
  .box_03a:nth-child(2){ padding: 0 5px 0 5px; }
  .box_03a:nth-child(3){ padding: 0 0 20px 10px; }
@media screen and (max-width: 769px){
.box_03a{ width: 100%; } 
  .box_03a:nth-child(1){ padding: 0 0 10px 0; }
  .box_03a:nth-child(2){ padding: 10px 0 10px 0; }
  .box_03a:nth-child(3){ padding: 10px 0 0 0; } }

.box_03b{ float: left; width: calc((100% - 20px) / 3); }
  .box_03b:nth-child(2){ margin: 0 10px 15px 10px; }

.box_03c{ float: left; width: calc(100% / 3); }
  .box_03c:nth-child(1){ padding: 0 10px 0 0; }
  .box_03c:nth-child(2){ padding: 0 5px 0 5px; }
  .box_03c:nth-child(3){ padding: 0 0 20px 10px; }
@media screen and (max-width: 769px){
.box_03c{ width: 100%; } 
  .box_03c:nth-child(1){ padding: 0 10px 10px 10px; }
  .box_03c:nth-child(2){ padding: 10px; }
  .box_03c:nth-child(3){ padding: 10px 10px 0 10px; } }

.box_04a{
    float: left; padding-bottom: 15px; width: calc((100% - 30px) / 4); }
  .box_04a:nth-child(2){ margin: 0px 5px 0px 10px; }
  .box_04a:nth-child(3){ margin: 0px 10px 0px 5px; }
  .box_04a p{ font-size:1em; padding-top:5px; }
@media screen and (max-width: 769px){
    .box_04a{
        float: left; padding-bottom: 15px; width: calc((100% - 30px) / 2); }
        .box_04a:nth-child(1){ margin: 0px 5px 0px 10px; }
        .box_04a:nth-child(2){ margin: 0px 10px 0px 5px; }
        .box_04a:nth-child(3){ margin: 0px 5px 0px 10px; }
        .box_04a:nth-child(4){ margin: 0px 10px 0px 5px; }
}

.box_10a{ 
    float: left; margin-bottom: 15px; width: calc((100% - 20px) / 2); }
    .box_10a:nth-child(2n){ margin-left: 20px; }
@media screen and (max-width: 769px){
    .box_10a{ width:100%; padding: 0 10px 5px 10px; }
    .box_10a:nth-child(2n){ margin-left: 0; }
}


/* footer */
.footer_box_AFS{ display:flex; width:80%; margin:20px auto; font-weight: 500;}
    .footer_03a{ width: calc(100% / 3); background-color:#fff; padding:10px 15px 20px 15px; text-align: justify;}
    .footer_03a:nth-child(1){ margin: 0 10px 0 0; }
    .footer_03a:nth-child(2){ margin: 0 5px 0 5px; }
    .footer_03a:nth-child(3){ margin: 0 0 0 10px; }
    .footer_03a hr{
        border-width: 3px 0 0 0; border-style: solid;
        border-color: #FEF8F2; margin:10px 0;}
    .footer_03a .title_AFS{ font-size:1.3em; font-weight: 600; color:#cc0000;}
    .footer_03a .title_sub_AFS{ font-size:1.2em; font-weight: 600;}
    
@media screen and (max-width: 769px){
    .footer_box_AFS{ display:flex; flex-flow:column; width:100%; margin:0; padding:20px 10px;}
    .footer_03a{ width: 100%; background-color:#fff; text-align: justify;}
    .footer_03a:nth-child(1){ margin: 0 0 10px 0; padding:15px; }
    .footer_03a:nth-child(2){ margin: 10px 0 10px 0; padding:15px; }
    .footer_03a:nth-child(3){ margin: 10px 0 0 0; padding:15px; } }


/* BOX_layout */
.BOX_layout01 {
    position: relative;
    margin: 2em 0 4em 0;
    padding: 0.5em 1em;
    border: solid 3px #7D532C;
    background: #ffffff;
    text-align: justify;
    line-height: 1.5em;
}
.BOX_layout01 .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 3px 9px 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #7D532C;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.BOX_layout01 p {
    margin: 0; 
    padding: 0;
}
@media screen and (max-width: 769px){
    .BOX_layout01 { margin: 2em 10px 4em 10px; }
}

/*--- Original Page ---*/
.AF_item_box{
    float: left; padding-bottom: 80px; width: calc((100% - 90px) / 4); }
    .AF_item_box:nth-child(2){ margin: 0px 15px 0px 30px; }
    .AF_item_box:nth-child(3){ margin: 0px 30px 0px 15px; }
    .AF_item_box:nth-child(6){ margin: 0px 15px 0px 30px; }
    .AF_item_box:nth-child(7){ margin: 0px 30px 0px 15px; }

.AF_item_box a{ text-decoration: none; }
    
@media screen and (max-width: 769px){
    .AF_item_box{
        float: left; padding-bottom: 80px; width: calc((100% - 60px) / 2); }
        .AF_item_box:nth-child(1){ margin: 0px 10px 0px 20px; }
        .AF_item_box:nth-child(2){ margin: 0px 20px 0px 10px; }
        .AF_item_box:nth-child(3){ margin: 0px 10px 0px 20px; }
        .AF_item_box:nth-child(4){ margin: 0px 20px 0px 10px; }
        .AF_item_box:nth-child(5){ margin: 0px 10px 0px 20px; }
        .AF_item_box:nth-child(6){ margin: 0px 20px 0px 10px; }
        .AF_item_box:nth-child(7){ margin: 0px 10px 0px 20px; }
}

.AF_item_title {
    width:100%; background: #ff3c3c; color: #fff;
    font-size: 1.1em; font-weight: bold;
    margin-top: 15px; padding: 0.5em;
    text-align:center; border-radius: 6px; }
.AF_item_title:hover {
    background: #cc0000; color: #fff;
}