@charset "UTF-8";
/* case */
.case_onpage{background:#a4000b;}
#h2ttl{background: url( "../examples/image/ttl.jpg" )top right /  auto 110px no-repeat #EEEEEE;height: 110px;margin-top: 0px;}
#h2ttl h2{font-size:3.0rem;line-height: 110px; }
#example h3,#example .ttl{font-size: 2.4rem;text-align: left;padding: 20px 20px;margin: 30px 0 30px 0px;background: #c1c1c1;    font-style: italic;}
#example .pagettl2{font-style:normal;text-align: center;font-size: 2.2rem;border-bottom:1px solid #333333;border-top:3px solid #333333;line-height: 100px;margin:30px 0px;background-color:transparent;padding:0px;}
#case h3{text-align: center;font-size: 2.4rem;border-bottom:3px solid #333333;padding-bottom: 20px;line-height: 120%;}
#case h4{text-align: center;font-size: 2.2rem;border-bottom:1px solid #333333;border-top:3px solid #333333;line-height: 100px;margin:30px 0px;}
#case dl dt{border-left:6px solid #A30000;border-bottom:2px solid #A30000;font-size: 2.0rem;color: #A30000;padding: 5px 0 5px 10px;font-weight: bold;margin-bottom: 10px;}
#case dl dd{margin-bottom: 40px;}
/*#case dl .leftbox{width: 48%;float: left;margin-right: 2%;}
#case dl .rightbox{width: 48%;float: left;margin-left: 2%;}	*/
.voice{font-size: 1.1rem;text-align: left;line-height: 120%;margin-top: 10px;}
.note{background: #FFF000;color: #C6000B;font-weight: bold;padding:2px 5px;}

/* example */
.sec02{padding: 20px 10px;width:60%;display:inline-block;}
.sec03 span{color: #36567F;vertical-align: top;}
.sec03_03{background: #36567F;color: #ffffff;text-align: center;padding: 5px 0;}
#example .ttl02{background: #36567F;color: #ffffff;text-align: center;margin: 30px 2% 20px 2%;padding: 15px 0;}
.sec04{width: 100;}
.sec04_02 ,.sec04_03 { border: 1px solid #CCCCCC; }
.arrow03{text-align: center;width: 50px;margin: 20px auto;}
.sec04 .sec04_03 h6 span{margin-top: 25px;}
/*.sec04 p{background: #36567F;color: #ffffff;text-align: center;margin-top: 10px;}*/
.sec04_01 img{padding:0 15px; margin: 5px 0;}
.sec05{width: 96%;margin: 0 2%;border: 1px solid #1D4C97;}
.sec06{/*background: #E2F2EF;*/padding: 20px 0;width: 96%;margin: 0px auto;}
.sec06 h5 {margin: 0 10px 5px 10px;}
.sec06 p {margin: 0 10px 20px 10px;}
.btn01{background:url( "../solution/image/example/btn01.png" )top center / auto 55px no-repeat;line-height: 55px;height: 55px; margin-bottom: 20px;color: #ffffff;font-size: 1.4rem;}
.btn02{background:url( "../solution/image/example/btn02.png" )top center / auto 55px no-repeat;line-height: 100%;height: 55px; margin-bottom: 20px;color: #ffffff;font-size: 1.4rem;position: relative;}
.btn02 p{position: absolute;top: 50%;left: 50%;width: 100%;text-align: center;
  -webkit-transform : translate(-50%,-50%);
  transform : translate(-50%,-50%);background:none;padding: 0;margin: 0;}
.btn03{background:url( "../solution/image/example/btn03.png" )top center / auto 55px no-repeat;line-height: 55px;height: 55px; margin-bottom: 20px;color: #ffffff;font-size: 1.4rem;}
.sec04 h6 span{font-size: 1.6rem;line-height: 120%;display: block;float: left;margin-bottom: 20px;margin-top: 15px;}
.sec04 h6 span.number{display: inline-flex;justify-content: center;align-items: center;border-radius: 50%;flex-flow: column; vertical-align: top; width: 38px;height: 38px;font-size: 2.2rem;line-height: 1.1rem;color: #ffffff;background: #36567F;margin:15px 10px 0 15px; }

/*0221追加_example */
#example .number {text-align: center;background: #108378;color: #ffffff;width: 50px;display: inline-block;vertical-align: middle;margin-right: 20px;padding: 10px 0;font-weight: bold;font-size:2.0rem;}
#example h7{font-size:2.0rem;font-weight: bold;}
.example__imgBox{text-align:center;display: -webkit-box;display: -ms-flexbox;display: flex;
justify-content: space-between;}
.example__imgBox-left{width:46%;}
.example__imgBox-right{width:50.8%;}
.exSec04__contentsWrap{width:90%;margin:0px auto;}
.example__textBox{text-align:center;display: -webkit-box;display: -ms-flexbox;display: flex;
justify-content: space-between;}
.exTextBox__inner{width:48%;border:1px solid #108378;padding:20px 0px;color:#108378;font-weight:bold;}
.exTextBox__row3{width:31%;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;display: -webkit-box;display: -ms-flexbox;display: flex;}
.exSec04__arrow{width: 0;height: 0;border-style: solid;border-width: 25px 25px 0 25px;border-color: #108377 transparent transparent transparent;margin: 50px auto 20px auto;}
.bgGreen{background:#dce9d5;text-align:center;}
.greenBold{font-size: 1.8rem;margin-bottom: 5px;letter-spacing: 0;color: #108378;font-weight:bold;}
.sec04Strong{font-size: 2.4rem;font-weight: bold;margin-bottom:20px;}
.bgwhite{background: #fff;color:#333;font-weight:normal;}

.example_textleft {display: inline-block;width: 85%;font-size: 1.4rem;margin-left: 21px;}
.hr {height: 1px;background-color: #333333;border: none;color: #333333;margin: 40px 0;}
.pagenavi01 .onpage{background:  #FF0100;}
.pagenavi02 .onpage{background:  #FF0100;}


/* 999以下共通*/
@media screen and (max-width: 999px) {
.voice{font-size: 1.1rem;text-align: left;line-height: 120%;}
/* example */
.sec01{background:url( "../solution/image/example/02.jpg" )top 0 right -100px / auto 200px no-repeat; }
#case .sec01 p{width:60%;}
.sec02 h5 ,.sec06 h5{font-size: 1.8rem;margin-bottom: 5px;letter-spacing: 0;}
.arrow01,.arrow02{text-align: center;}
.arrow01 img ,.arrow02 img{transform: rotate(90deg);width: 13px;margin: 20px 0;}
.sec07 img{width:25%;margin-right: 2%;float: left;}
.sec07 div{border-bottom: 20px solid #ffffff;width:73%;float: left;}
.sec07 .bb{border-bottom: 20px solid #ffffff;width:73%;float: left;border-top: 1px solid #cccccc;padding-top: 20px;}
.sec07 p{border-left: 10px solid #E50012;padding-left: 20px;line-height: 120%;}
.pc{display:none;}
}

/* 768以上*/
@media screen and (min-width: 768px) {
.sp{display: none;}
.pagenavi01 a{background:  #000000;color: #ffffff;width: 49%;float: left;margin:0 0 15px 0;text-align: center;display: block;min-height:20px;padding:20px;}
.pagenavi02 a{background:  #000000;color: #ffffff;width: 49%;float: left;margin:0 0 15px 1%;text-align: center;display: block;min-height:20px;padding:20px 0px;}
.pagenavi01 a:hover,.pagenavi02 a:hover{background:  #FF0100;}
.sp2 {display: none;}


/* example */
 .sec04 p{padding: 5px 20px; }
#example .ttl02{font-size: 2.0rem;}
.sec03_01{width: 50%;height: 310px; float: left;background:url( "../solution/image/example/03.png" )bottom center / 80% auto no-repeat #fff;padding: 20px 0 0 20px;}
.sec03_02{width: 50%;height: 310px;float: left;background: #cccccc;background:url( "../solution/image/example/04.png" )bottom center / 80% auto no-repeat #fff;padding: 20px 0 0 20px;}
.sec03{width: 100%;letter-spacing: 0;background:url( "../solution/image/example/05.jpg" )top right / auto 438px no-repeat #fff;display: inline-block;vertical-align: top;}
.sec04_01 {border: 1px solid #CCCCCC;}
.bluebox{background: #E4EBF4;margin: 5px 15px 15px 15px;text-align: center;padding: 38px 28px 18px 28px;}
.sec05 h6{font-size: 2.2rem;text-align: center;margin-top: 15px;}
.sec05 p{font-size: 1.8rem;color:#E50012;text-align: center;font-weight: normal;margin: 10px 0;}
/*0221追加_example */
.exTtl_img{float: right;width: 25%;height: auto;}

/* example */
.sec01{background:url( "../solution/image/example/02.jpg" )top right / auto 245px no-repeat; }
.sec01 p{width:60%;padding: 30px 0px;}
.sec02 h5 ,.sec06 h5{font-size: 1.8rem;margin-bottom: 5px;letter-spacing: 0;color:#108378;}
.sec04_01 {width: 49%; border: 1px solid #CCCCCC;float: left; }
.sec04_02wrap{width: 49%;float: left;}
.arrow01{width: 2%;float: left;text-align: center;}
.arrow01 img{width: 13px;margin-top: 150px;}
.arrow02{text-align: center;}
.arrow02 img{transform: rotate(90deg);width: 13px;margin: 20px 0;}
.sec07{width:66%;float: left;}
.sec07img{width:32%;margin-left: 2%;float: left;}
.sec07 div{border-bottom: 20px solid #ffffff;}
.sec07 .bb{border-bottom: 20px solid #ffffff;border-top: 1px solid #cccccc;padding-top: 20px;}
.sec07 p{border-left: 10px solid #E50012;padding-left: 20px;line-height: 180%;}
.pctablet{display:none;}

/* example */
 .sec04 p{padding: 5px 20px; }
#example .ttl02{font-size: 2.0rem;}
.sec03_01{width: 50%;height: 310px; float: left;background:url( "../solution/image/example/03.png" )bottom center / 80% auto no-repeat #fff;padding: 20px 0 0 20px;}
.sec03_02{width: 50%;height: 310px;float: left;background: #cccccc;background:url( "../solution/image/example/04.png" )bottom center / 80% auto no-repeat #fff;padding: 20px 0 0 20px;}
.sec03{width: 100%;letter-spacing: 0;background:url( "../solution/image/example/05.jpg" )top right / auto 438px no-repeat #fff;display: inline-block;vertical-align: top;}
.sec04_01 {border: 1px solid #CCCCCC;}
.bluebox{background: #E4EBF4;margin: 5px 15px 15px 15px;text-align: center;padding: 38px 28px 18px 28px;}
.sec05 h6{font-size: 2.2rem;text-align: center;margin-top: 15px;}
.sec05 p{font-size: 1.8rem;color:#E50012;text-align: center;font-weight: normal;margin: 10px 0;}
/*0221追加_example */
.exTtl_img{float: right;width: 25%;height: auto;}
/* s_partner */
#s_partner .half{width: 48%;float: left;}
#s_partner .half:nth-child(odd){margin-right: 4%;}
#s_partner #sp_ttl01 ,#s_partner #sp_ttl02{font-size: 2.5rem;}
.dd01{width: 52%;margin-right: 3%;}
.dd02{width: 45%;}
.sec03_02 span{padding: 5px 0px;width: 100%;border: 2px solid #108378;display: block;text-align: center;color: #108378;font-weight:bold;margin-bottom: 20px;}
.sec03_01 span{padding: 5px 0px;width: 100%;border: 2px solid #108378;display: block;text-align: center;color: #108378;font-weight:bold;margin-bottom: 20px;}
.addon_img01{width:80%;margin:0px auto;display: block;}
.sec04 .example__numberttlP {padding-left:0px;}



}
/* 767以下共通*/
@media screen and (max-width: 767px) {
#h2ttl{background: url( "../examples/image/ttl.jpg" )top right /  auto 90px no-repeat #EEEEEE;height: 90px;margin-top: 0px;}
#h2ttl h2{line-height: 90px; color: #333333; ;font-size:2.6rem;}
#case h3{font-size: 1.8rem;font-weight: bold;letter-spacing: 0;}
#case h4{font-size: 1.8rem;line-height: 60px;}
/*#case dl .leftbox,#case dl .rightbox{width:100%;float:none;margin-right:0;margin-left:0; }*/
#case dl dt{font-size: 1.8rem;padding: 5px 0 5px 5px;letter-spacing: 0;}
.voice{font-size: 1.2rem;letter-spacing: 0;}

/* example */
#example .ttl02{font-size: 1.8rem;}
#example h3,#example .ttl{font-size: 1.8rem;padding: 10px 10px;margin: 20px 0;background: #c1c1c1;font-style: italic;text-align: center;}
.sec04 p{padding:10px 5px;line-height: 120%;font-size: 1.4rem; }
.sec03_03{padding: 10px 5px;line-height: 120%;font-size: 1.4rem;}
.longttl .ttl{font-size: 1.6rem;}
.sec01{background:url( "../solution/image/example/02.jpg" )top  right  / auto 100% no-repeat ;}
.sec01 p{background: hsla(0,0%,100%,0.80);padding: 10px;}
.sec02 h5 ,.sec06 h5{font-size: 1.6rem;line-height: 120%; margin-bottom: 5px;letter-spacing: 0;}
.sec03_01 ,.sec03_02{padding:10px 20px;background: hsla(220,43%,99%,0.50);}
.sec03{width:100%;letter-spacing: 0;background: #fff;/*background:url( "../solution/image/example/05.jpg" )top -30px right -20px / auto 140% no-repeat #fafbfd;*/}
.sec04_01 {border: 1px solid #CCCCCC;}
.arrow01,.arrow02{text-align: center;}
.arrow01 img ,.arrow02 img{transform: rotate(90deg);width: 13px;margin: 20px 0;}
.sec07 div{border-bottom: 20px solid #ffffff;width:100%;float: left;}
.sec07 .bb{border-bottom: 20px solid #ffffff;width:100%;float: left;border-top: 1px solid #cccccc;padding-top: 20px;}
.sec07 p{border-left: 10px solid #E50012;padding-left: 20px;line-height: 120%;}
.sec07 img {width: 80%;margin:10px 10% 30px 10%;}
.btn01 ,.btn02 ,.btn03{letter-spacing: 0;font-size: 1.5rem;margin-bottom: 4px;}
.btn01:last-child,.btn02:last-child,.btn03:last-child{margin-bottom: 0;}
.bluebox{background: #E4EBF4;margin: 0;text-align: center;padding: 4px;}
.sec04 h6 span{width: calc(100% - 63px);}
.sec05 h6{font-size: 1.8rem;text-align: center;margin-top: 15px;}
.sec05 p{font-size: 1.6rem;color:#E50012;text-align: center;font-weight: normal;margin: 10px 0;letter-spacing: 0;}

/*0221追加_example */
.sec01 .ml20{margin-left: 0px;}
#example .number{width:100%;margin-bottom: 20px;}
#example h7{text-align:center;}
.sec04{text-align:center;}
.example__imgBox{-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
.example__imgBox-left{width:100%;}
.example__imgBox-right{width:100%;margin-top:20px;}
.example__textBox{-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;margin-top: 30px;}
.exTextBox__inner{width:100%;margin-bottom: 20px;}
.sec04 .sec04Strong{font-size: 2.0rem;font-weight: bold;margin-bottom:10px;}
.exSec04__arrow {margin: 30px auto 20px auto;}
.sec04 .mt30{margin-top: 10px;}
.sec06 p {margin: 20px 10px 20px 10px;line-height: 110%;}
.sec02{width: 100%;}
.sec03_01 span {padding: 5px 0px;width: 100%;border: 2px solid #108378;display: block;text-align: center;color: #108378;font-weight: bold;margin-bottom: 20px;}
.sec03_02 span{padding: 5px 0px;width: 100%;border: 2px solid #108378;display: block;text-align: center;color: #108378;font-weight: bold;margin-bottom: 20px;}
/* s_partner */
#s_partner #sp_ttl01 ,#s_partner #sp_ttl02{font-size: 2.0rem;padding: 40px 0px;}
.dd01{width: 100%;}
.dd02{width: 100%;margin-top: 20px;}
.pc{display:none;}
/*.pctablet{display:none;}*/
.pagenavi01 a{background:  #000000;color: #ffffff;width: 100%;float: left;margin:0 0 15px 0;text-align: center;display: block;min-height:20px;padding:20px;}
.pagenavi02 a{background:  #000000;color: #ffffff;width: 100%;float: left;margin:0 0 15px 1%;text-align: center;display: block;min-height:20px;padding:20px 0px;}
.pagenavi01 a:hover,.pagenavi02 a:hover{background:  #FF0100;}
}