@charset "UTF-8";

h3 {padding:0.5em; background:#78c8e6; border-radius:3px; color:#fff; line-height:1.4;}
h3 + p {margin-top:0.7em;}
.ptxt {padding-top:0.5em;}
h2 + .ptxt {padding-top:0;}


/*********************************
 * ～900
 *********************************/

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

#cmn_bnr {margin:1em auto 0 auto;}
  
.ptxt p {width:calc(100% - 2em); margin-right:auto; margin-left:auto;}

.area2 {margin:3em auto 0 auto; padding:1.5em 0;}
.area2 h2 {margin:0; color:#fff; border-bottom:4px double #fff;}
.area2 h2::after {display:none;}
.area2 .ptxt {}
.area2 .ptxt .fleft {padding:1.5em 5%; background:#c9e9f5; line-height:1;}
.area2 .ptxt .fright {padding:1.5em 5%; background:#78c8e6; color:#fff;}
.area2 .ptxt .fright p {width:100%;}

}



/*********************************
 * 901～
 *********************************/

@media screen and (min-width:901px) {

#cmn_bnr {margin:3em auto 0 auto;}
  
.ptxt p {width:calc(100% - 4em); margin-right:auto; margin-left:auto;}

.area2 {margin:3em auto 0 auto; padding:2.5em 0; background:linear-gradient(to right, #c9e9f5 0%, #c9e9f5 50%, #78c8e6 50%, #78c8e6 100%);}
.area2 h2 {margin:0; color:#fff; border-bottom:4px double #fff;}
.area2 h2::after {display:none;}
.area2 .ptxt {display:flex; position:relative; justify-content:space-between; width:91%; max-width:980px; margin:0 auto;}
.area2 .ptxt .fleft {width:50%; padding:0 2.5em 0 0;}
.area2 .ptxt .fright {width:50%; padding:0 0 0 2.5em; color:#fff;}
.area2 .ptxt .fright p {width:100%;}

}


