@charset "utf-8";
/* CSS Document */

/*----------------------------------------
info
----------------------------------------*/

/*pc*/
@media only screen and (min-width: 768px) {



.cont01 { padding: 50px 0;}
.cont01 .box { display: flex; margin: 0 0 50px; flex-direction: row-reverse;}
.cont01 .box .txt { width: 870px;}
.cont01 .box .txt h3 { font-size: 2.4rem; color: #086DB0; margin: 0 0 30px; border-bottom: dotted 2px #CCC; padding: 0 0 10px;}
.cont01 .box .txt h4 { background: #086DB0; font-size: 1.6rem; color: #FFF; display: inline-block; padding: 2px 20px; border-radius: 30px; margin: 0 0 20px;}
.cont01 .box .txt p {}
.cont01 .box .txt dl { overflow: hidden; font-size: 1.4rem;}
.cont01 .box .txt dl dt { float: left; width: 100px; padding: 3px 0;}
.cont01 .box .txt dl dd { margin: 0 0 0 100px; padding: 3px 0;}
.cont01 .box .img { width: 300px; margin: 0 30px 0 0;}
.cont01 .box .img img { width: 100%;}
.cont01 .box .img span { padding: 5px 10px;}




}



/*sp*/
@media only screen and (max-width: 767px) {



.cont01 { padding: 50px 2%;}
.cont01 .box { display: inherit; margin: 0 0 50px;}
.cont01 .box .txt { width: 100%;}
.cont01 .box .txt h3 { font-size: 2.4rem; color: #086DB0; margin: 0 0 30px; border-bottom: dotted 2px #CCC; padding: 0 0 10px;}
.cont01 .box .txt h4 { background: #086DB0; font-size: 1.6rem; color: #FFF; display: inline-block; padding: 2px 20px; border-radius: 30px; margin: 0 0 20px;}
.cont01 .box .txt p {}
.cont01 .box .txt dl { overflow: hidden; font-size: 1.4rem;}
.cont01 .box .txt dl dt { float: left; width: 100px; padding: 3px 0;}
.cont01 .box .txt dl dd { margin: 0 0 0 100px; padding: 3px 0;}
.cont01 .box .img { width: 300px; margin: 20px auto;}
.cont01 .box .img img { width: 100%;}
.cont01 .box .img span { padding: 5px 10px;}




}