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

.items{ display:flex; flex-wrap:wrap;}

.items article{ display:block; background: #F39800; color: #231815; border: solid 1px #FFFFFF;  padding: 2.0em; width: 33.333%; position: relative;}
.items article.widthx2{ width:66.666%;}
.items article.widthx3{ width:100%;}
.items article:nth-child(2n){ background:#231815; color: #F39800;}
.items article *{ margin-top:0;}

.items article p{ margin-top:1.0em; line-height: 1.5; position: relative; z-index: 5;}
.items article .title{ margin: 0; font-size:116%; font-weight: bold;}
.items article .cp{ margin:0; line-height: 1.5;}
.items article .ip{ margin: 1.0em 0 0 0; border-top:dotted 4px #231815; line-height: 1.5; font-size:93%;}
.items article:nth-child(2n) .ip{ border-color:#F39800;}

.items article .no{ display: flex; margin: 0; padding: 0; width:80px; height: 80px; background: url(img/pa.png) no-repeat left top; background-size: contain; position: absolute; top: -15px; right: 10px; color: #FFFFFF;font-size: 300%; font-weight: 800; line-height: 1.0;
align-items: center; justify-content:center; z-index: 5; text-shadow: black 0 0 2px; }

section.mainp{
	color: #333333;
background: rgb(157,0,99); 
background: -moz-linear-gradient(left, rgba(157,0,99,1) 0%, rgba(231,55,140,1) 100%); 
background: -webkit-linear-gradient(left, rgba(157,0,99,1) 0%,rgba(231,55,140,1) 100%); 
background: linear-gradient(to right, rgba(157,0,99,1) 0%,rgba(231,55,140,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d0063', endColorstr='#e7378c',GradientType=1 ); 
}


.mainp .no{ display: flex; margin: 1.0em auto 0 auto; padding: 0; width:80px; height: 80px; background: url(img/pa.png) no-repeat left top; background-size: contain;  color: #FFFFFF;font-size: 300%; font-weight: 800; line-height: 1.0;
align-items: center; justify-content:center; z-index: 0; text-shadow: black 0 0 2px;}
.mainp .page-title{ border:none;  margin: 0;}
.mainp article{ margin: 1.0em 0 0 0; padding: 1.0em 2.0em; background: #FBE7F0; border-radius: 3px;}
.mainp article *{ margin-top:0;}
.mainp article .title{ color:#A8046A; font-size:128%; font-weight: 800; border-bottom: solid 2px #000000;}
.mainp article .image{ width:30%; float: right;}

@media only screen and (max-width:480px){ /* sm pnly */
  .items{ display:block;}
  .items article{ width:100%;}
  
  .mainp article .image{ width:100%; float: none;}
}