/*-----------------------------------------------------------------------*/
/*	performance.html
/*----------------------------------------------------------------------*/
.performance-pagettl {
  position: relative;
  background-image: url(/assets/img/performance-pagettl-bg_01.jpg);
}
@media screen and (max-width: 767px) {
  .performance-pagettl {
    height: auto !important;
    background-image: none;
  }
}

.performance-pagettl__text {
  position: absolute;
  top: 65px;
  left: 190px;
}
@media screen and (max-width: 767px) {
  .performance-pagettl__text {
    position: static;
    width: 100%;
    padding: 15px 0;
    background-color: #0c3471;
  }
  .performance-pagettl__text img {
    max-width: 200px;
    width: 100% !important;
    height: auto !important;
  }
}

.performance-pagettl__img {
  width: 100%;
}
.performance-pagettl__img img {
  width: 100%;
  height: auto;
}

/* contents */
.case-box {
  min-height: 331px;
  margin-bottom: 50px;
}
.case-box h4{
  margin-bottom: 40px;
}
.case-box p{
  width: 385px;
  margin-bottom: 40px;
}
.case-box:nth-child(odd) h4{
  text-align: right;
}
.case-box:nth-child(odd) p{
  margin-left: auto;
}
.case-box.case01{
  background: url(../img/performance-img_03.png) no-repeat;
  background-position: right top;
}
.case-box.case02{
  background: url(../img/performance-img_05.png) no-repeat;
  background-position: left top;
}
.case-box.case03{
  background: url(../img/performance-img_07.png) no-repeat;
  background-position: right top;
}
.case-box.case04{
  background: url(../img/performance-img_09.png) no-repeat;
  background-position: left top;
}
.case-box.case05{
  background: url(../img/performance-img_11.png) no-repeat;
  background-position: right top;
}
.case-box.case06{
  background: url(../img/performance-img_13.png) no-repeat;
  background-position: left top;
}


@media screen and (max-width: 767px) {
.case-box {
  min-height: inherit;
  margin-bottom: 50px;
}
  .cnt-main img{
    width: 100%;
  }
  .case-box p{
    width: 100%;
  }
.case-box:nth-child(odd) p{
  margin-left: 0;
}
.case-box.case01,
.case-box.case02,
.case-box.case03,
.case-box.case04,
.case-box.case05,
.case-box.case06{
  background: none;
}

}

/*追加のcss*/



.syourei_box{
position: relative;	
padding: 8px;
box-shadow: 2px 2px 5px #ccc;
position: relative;
margin-bottom: 72px;
	
}
.syourei_box:after {
display: block;
position: absolute;
top: 0;
left: 0;
border-right: 90px solid transparent;
border-top: 90px solid #0c3471;
content: "";
z-index:0;
}
.syourei_box h4{
font-size:28px;
color:#0c3471;
    font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;	
font-weight:bold;
margin-bottom:8px;
line-height:1.3em;
}
.s_no{
position: absolute;
top: 10px;
left: 8px;
font-size: 14px;
color: #fff;
z-index: 1;
line-height: 1.5em;
text-align: center;
letter-spacing: 0.1em;
    font-style: italic;
}
.s_no i{
font-weight:bold;
font-size:20px;	
}
.sy_in{
width:100%;
max-width:600px;
margin:32px auto;
}
.syourei_box p{
margin-bottom:16px;
}
.syourei_box img{
margin:0 auto;
width:100%;
max-width:500px;
display:block;
	
}

@media screen and (max-width: 767px) {
.syourei_box h4{
font-size:22px;
padding-left:18%;
}
.syourei_box:after{
border-right: 80px solid transparent;
border-top: 80px solid #0c3471;

}
.s_no{
font-size:12px;	
}
.s_no i{
font-size:16px;
}
}