/* ===================================================================
CSS
 file name  :  second-op.css
=================================================================== */
h2#page_title{
	background-image: url(../images/preview/ttl_preview.png);
}
@media screen and (min-width: 769px) {
  .preview_wrap {
      font-size: 16px;
      line-height: 1.8;
  }
/* PC用のスタイル記述 */
    .preview_wrap
    {
        width: 1000px;
        margin: auto;
    }
	p.lead{
		font-size: 18px;
		text-align: center;
	}
	p.lead2{
		font-size: 18px;
		text-align: center;
		font-weight: bold;
		color: #00306C;
		margin-top: 50px;
	}
	p.lead3{
		margin-top: 20px;
		text-align: center;
	}
	ul.gimon{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: stretch;
	}
	ul.gimon li{
		width: 230px;
		height: 60px;
		box-sizing: border-box;
		background: #EAF2FF url(../images/preview/pre_koe.png) no-repeat;
		background-size: 90px auto;
		background-position: -27px -22px;
		padding: 5px 0;
		margin: 20px 8px auto 8px;
		line-height: 140%;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	.point{
		background: #F6F6F8;
		padding: 30px 40px;
		margin-top: 30px
	}
	.point .main_text{
		color: #00306C;
		font-size: 20px;
	}
	.point .main_text strong{
		font-size: 24px;
	}
	.point strong.emphasize{
		font-size: 22px;
		color: #00306C;
	}
	.image_sell{
		margin-top: 40px;
	}
	.second_op_btn .btn{
		margin:50px auto auto auto;
		font-size:24px;
		background:#00306D;
		padding:20px 0;
	}
}
@media screen and (max-width: 768px) {
    h2#page_title{
      margin:0;
      height: 100px;
      padding:70px 0 0 0;
      box-sizing: border-box;
      background-color: #00306C;
      background-repeat: no-repeat;
      background-position: center 10px;
      background-size: auto 60px;
      font-size: 12px;
    }
    .preview_wrap {
      font-size: 12px;
      line-height: 1.8;
        width: auto;
    }
/* スマートフォン用のスタイル記述 */
    .detail_inner
    {
		margin: 0 10px;
    }
	p.lead{
		text-align: center;
	}
	p.lead2{
		text-align: left;
		font-weight: bold;
		color: #00306C;
		margin: 20px 20px auto 20px;
	}
	p.lead3{
		margin: 20px 20px auto 20px;
	}
	ul.gimon{
		margin: 10px 20px auto 20px;
	}
	ul.gimon li{
		box-sizing: border-box;
		background: #EAF2FF url(../images/preview/pre_koe.png) no-repeat;
		background-size: contain;
		padding: 10px 10px 10px 30px;
		margin-top: 10px;
		line-height: 140%;
	}
	.point{
		background: #F6F6F8;
		padding: 10px;
		margin: 10px 20px auto 20px;
	}
	.point .main_text{
		color: #00306C;
		font-size: 120%;
	}
	.point .main_text strong{
		font-size: 120%;
	}
	.point strong.emphasize{
		font-size: 120%;
		color: #00306C;
	}
	.image_sell{
		margin: 20px 20px auto 20px;
	}
	.second_op_btn .btn{
		margin: 20px 20px auto 20px;
		font-size:120%;
		background:#00306D;
		padding:10px 0;
	}
}