@charset "UTF-8";

/*---------- header ----------*/

.sub_title {
text-align:center;
font-weight:bold; 
font-size:2rem; 
}

.cap {
text-align:center;
}


/*----
.mainimage {
    width: 100%;
    height: px;
    background: url(../01_z9/img/main_01.jpg);
    overflow: hidden;
    position: relative;
}
-------*/

.width820 {
    width: 820px;
    margin: 0 auto;
    padding: 0;

}

.sub2 {
font-weight:bold; 
font-size:2rem; 
}

.sub1 {
font-weight:bold; 
font-size:3.4rem; 
}

.textdeco {
background-color:black;
color:white;
}


.red {
    color: red;
}

.st {
    margin-top: 40px;
}


.sti {
font-weight:bold; 
font-size:2rem; 
padding: 5px;
background-color: #C0C0C0;
border-radius: 5px;

}

.over {
overflow: hidden;

}
.l_box {
float:left;
width: 45%;
}

.r_box {
float:right;
width: 45%;
    overflow: hidden;
    padding-left: 24px;
}

.r_img {
  max-width: 100%;
    height: auto;
}




/*---------- small layout ----------*/
@media screen and (max-width:999px){
  .width820 {
    width: auto;
    margin: 0 auto;
    padding: 0 15px;
  }
}
@media screen and (max-width:599px){
  .width820 {
    width: auto;
    margin: 0 auto;
    padding: 0 15px;
  }
}

@media screen and (max-width:999px){
  .l_box {
float: none;
    width: 100%;
    margin-bottom: 10px;
    padding-left: 0;
}
}
@media screen and (max-width:999px){
 .r_box {
float: none;
    width: 100%;
    margin-bottom: 10px;
    padding-left: 0;
}
}

@media screen and (max-width: 599px){
  .l_box .r_box  {
float: none;
    width: 100%;
    margin-bottom: 10px;
    padding-left: 0;
}
}