@charset "UTF-8";
/* CSS Document */


#contents {
  /* .pickup .special共通 */
}

#contents #maincontents {
  font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,sans-serif;
  padding-bottom:20px;
}

#contents #maincontents a:hover img {
	opacity: 0.5 ;
}

#contents #maincontents h6{
  background-color: #53cde2;
  padding:5px;
  margin:8px 0px;
  font-weight:bold;
}

#contents .head {
  background: #2C88B4;
  box-sizing: border-box;
  padding: 12px 15px;
  margin-bottom: 20px;
  overflow: hidden;
}

.menu {
    list-style: none;
    overflow: hidden;
}
 
.menu li {
    float: left;
    margin:5px;
}

.menu li a {
    display: block;
    border: 1px solid #a6d0e4;
    padding: 10px 15px;
    background-color: #fff;

}

.menu li a:hover {
    background-color: #d1f4fa;
}

.sp_box {
  background-color: #edf9fc;
  padding: 0px;
  margin:15px;
}

.sp_contents{
  margin:0px 20px 20px;;
}

.sp_title{
  background-color:#53cde2;
  color:#fff;
  font-size:large;
  margin-bottom:15px;
  padding:10px;
  font-weight: bold;
}

.sp_box2{
  background-color: #fff;
  width:90%;
  margin-left:auto;
  margin-right:auto;
  padding:15px;
  margin-top:10px;
  margin-bottom:15px;

}

.sp_title2{
  color:#53cde2;
  font-size:large;
  margin-bottom:10px;
  padding:5px;
  font-weight: bold;
  padding-bottom: .5em;
  border-bottom: 2px solid #53cde2;
}

ul.sp_list li {
  position: relative;
  margin-left:20px;
  line-height: 2em
}
ul.sp_list li::after,
ul.sp_list li::before {
  display: block;
  content: '';
  position: absolute;
}
ul.sp_list li::after {
  top: .37em;
  left: -1.2em;
  width: 14px;
  height: 14px;
  background-color: #53cde2;
  border-radius: 100%;
}
ul.sp_list li::before {
  z-index: 2;
  top: .625em;
  left: -.975em;
  width: 4px;
  height: 4px;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
margin-top:1px;
}


.box1{
  width: 190px;
  height:250px;
  text-align: center;
  padding:5px 10px;
  float: left;
}

.box1 img{
   width:190px;
   height:190px;
}

.clear_both{
  clear:both;
}


.b{
  font-weight:bold;
}

.red{
  color:#dc143c;
}

.r-img{
  float:right;
}

.t-left{
    width:  60%;

}

@media screen and (max-width: 767px) {
.box1{
  width: 100%;
  height:100px;
  text-align: center;
  padding:5px 10px;
  display: flex;
  align-items: center;

}

.box1 img{
   width:100px;
   height:100px;
   float: left;
   margin-right:10px;
}

.sp_box {
  margin:0px;
}

.r-img{
  float:left;
}

.t-left{
    width:  100%;
  clear:both;
}

}

#nav_sp{
    padding:10px;
}

#nav_sp ul li{ 	
    display: inline;
	border:solid 1px #FFC2AF;
	padding:10px;
	background-color:#FFFAAF;
	line-height:3.5em;
 }

figure {
    display: inline-block;   /* インラインブロック化 */
    margin: 0px 3px 7px 0px; /* 外側に余白を追加(※右に3px・下に7px) */
    background-color:#FFF;
    
}
/* ▼画像に対する装飾 */
figure img {
    display: block;          /* 余計な余白が出ないようにする */
    margin: 0px 0px 3px 0px; /* 下側にだけ3pxの余白を追加 */
    width:200px;
    height:200px;
}
/* ▼キャプションに対する装飾 */
figcaption {
    font-size: 0.9em;        /* 文字サイズを90%に */
    text-align: center;      /* 中身をセンタリング */
}
