/*RESET----------*/
.container .contents {
background-color: #fff;
 }
.con00 a {
color: #00bfff; }

.con00 a:active {
background-color: #00bfff; }

/*CONTENTS----------*/
.con00 {
position: relative;
margin-bottom: 50px; }

.con00bg {
width: 100%; }

.con00tx {
color: #fff;
font-size: 1.2em;
text-shadow: 1px 1px 2px #000;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
width: 100%;
transform: translate(-50%,-50%); }
/*-----*/
.con01 {
font-size: 18px;
line-height: 150%;
text-align: center;
max-width: 1000px;
margin-right: auto;
margin-bottom: 30px;
margin-left: auto; }
.con01 img {
max-width: 100%;
}
/*-----*/
.con01 .ttl01 {
color: #cd5c5c;
font-size: 2em;
font-weight: bold;
margin-bottom: 25px; }
.con01 .ttl02 {
font-size: 1.3em;
font-weight: bold;
margin-bottom: 25px; }
.marker-bold {
  background: linear-gradient(transparent 55%, #FFE4E1 55%);
}
/*-----*/
.con01 .box {
margin-bottom: 100px;
display: flex;
justify-content: space-around; }
.con01 .item1 {
text-align: left;
padding-right: 1%;
padding-left: 1%;
flex-basis: 48%; }
.con01 .item2a {padding-right: 1%;
padding-left:  1%;
flex-basis:    18%; }
.con01 .item2b {
padding-right: 1%;
padding-left: 1%;
flex-basis: 23%; }
.con01 .item2c {
text-align: left;
padding-right: 1%;
padding-left:  1%;
flex-basis:    48%; }
.con01 .item3a {padding-right: 1%;
padding-left:  1%;
flex-basis:    28%; }
.con01 .item3b {
padding-right: 1%;
padding-left: 1%;
flex-basis: 23%; }
/*-----*/
.con01 .bg1 {
background-image: url(img/stb_10years_04.jpg);
background-repeat: no-repeat;
background-size: contain; }
.con01 .bg2 {
background-image: url(img/stb_10years_07.png);
background-repeat: no-repeat;
background-size: contain; }
/*-----*/
.con01 .ttl03 {
font-weight: bold;
background-color: #d3d3d3;
padding-top: 3px;
padding-bottom: 3px; }


.con01 .ttl04 {
  position: relative;
}
.con01 .ttl04::after {
  position: absolute;
  content: "";
  top: 50%;
  width: -moz-available;
  height: 1px;
  background-color: black;
}
.spMrgD {margin-bottom: 10px; }

@media screen and (max-width:1300px){
.con00tx {
font-size: 1em;
line-height: 1.3em;
width: 99%; }


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


/*CONTENTS----------*/
.con00 {
width: 100% !important;
}

.con00tx {
line-height: inherit;
font-size: 1.2em;
 }
/*-----*/
.con01 .box {
width: 80%;
margin-right: auto;
display:         block;
margin-bottom:   100px;
margin-left: auto; }
.con01 .item1 {
margin-bottom: 50px;
padding-right: 0;
padding-left:  0;
 }

.con01 .item2a {
margin-bottom: 50px;
padding-right: 0;
padding-left:  0; }

.con01 .item2b {
margin-bottom: 50px;
padding-right: 0;
padding-left:  0;
flex-basis:    23%; }

.con01 .item2c {
text-align:    left;
margin-bottom: 50px;
padding-right: 0;
padding-left:  0; }

.con01 .item3a {
margin-bottom: 50px;
padding-right: 0;
padding-left:  0; }

.con01 .item3b {
margin-bottom: 50px;
padding-right: 0;
padding-left:  0; }
/*-----*/
.con01 .bg1 {background-size:   cover; }

.con01 .bg2 {background-size:   cover; }

/*-----*/
.spMrgD {
margin-bottom: 50px; }
}
@media screen and (max-width:650px){
/*DEPEND ON YOUTUBE WIDTH*/
/*FOR-YOUTUBE-SMARTPHONE----------*/

.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}

.video-container iframe,  
.video-container object,  
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}

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

.con00tx {
line-height: 1.3em;
font-size: 1em;
 }
}