@charset "utf-8";

/*---------- common ----------*/
body {
	background: #ffffff;
	font-family:  'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体', serif ;
	font-size: 15px;
	color: #111111;
	line-height: 1.6em;
}

.bg {
	background-color:whitesmoke;
}

.main {
	max-width:900px;
	margin-left: auto;
	margin-right: auto;
	background-color:white;
}

strong {
        font-size: 30px;
}

a {
	color: white;
	font-size:16px;
	text-decoration: underline;
	outline: none;
}

a:hover {
	color: #074BB4;
	text-decoration: none;
	outline: none;
}

img {
	max-width: 100%;
	height: auto;
	background: #ffffff;
	padding-bottom:20px;
/*	vertical-align:bottom;
*/
}
.small {
	font-size: 11px;
}
.large {
	font-size: 20px;
}
.blk,
.blk:hover {
	color: #111111;
}
.normal {
	font-weight: normal;
}

/*---------- header ----------*/

h2 {
    margin:  0;                 /* デフォルトCSS打ち消し */
    position:  relative;        /* 位置調整 */
    font-weight:  normal;       /* 文字の太さ調整 */
    font-size: 24px;            /* 文字サイズ指定 */
    background-color:  #762034;    /* 背景色指定 */
    color:  #fff;               /* 文字色指定 */
    padding: 10px 10px 10px 30px;  /* 余白指定 */
    margin-bottom:  0px;       /* 周りの余白指定 */
    margin-top:  20px;       /* 周りの余白指定 */
}
p {
    margin:  0;                 /* デフォルトCSS打ち消し */
    line-height: 2;             /* 行間調整 */
    padding-left:20px;
    padding-right:20px;

}
 
h2::before {
    content: '';                /* 空の要素を作る */
    height: 110%;               /* 高さ指定 */
    width: 3px;                 /* 幅指定 */
    display:  block;            /* ブロック要素にする */
    position:  absolute;        /* 位置調整 */
    left: 14px;                 /* 位置調整 */
    top: -3px;                  /* 位置調整 */
    margin:  auto;              /* 位置調整 */
    background-color:  #fff;    /* 背景色指定 */
    transform: rotate(3deg);    /* 回転 */
}
h2::after {
    content: '';                /* 空の要素を作る */
    height: 116%;               /* 高さ指定 */
    width: 3px;                 /* 幅指定 */
    display:  block;            /* ブロック要素にする */
    position:  absolute;        /* 位置調整 */
    left: 14px;                 /* 位置調整 */
    top: -6px;                  /* 位置調整 */
    margin:  auto;              /* 位置調整 */
    background-color:  #fff;    /* 背景色指定 */
    transform: rotate(-15deg);  /* 回転 */
}


h3 {
     position: relative;
     padding-left: 20px;
     padding-right: 20px;
     margin-top:10px;
     margin-bottom:20px;
     font-weight:bold;
     font-size: 22px; 
}

/*
h3::after {
     position: absolute;
     top: 40%;
     left:0;
     transform:translateY(-50%);
     content: '';
     width: 10px;
     height:10px;
     border: solid 4px #762034;
     border-radius:100%;
}
*/




ul, ol{
  color: #96514d;/*文字色*/
  border: solid 2px #f6bfbc;/*破線 太さ 色*/
  background: #fef4f4; /*背景色*/
  padding: 10px 10px 10px 20px;
  margin-left:20px;
  margin-right:20px;
}

ul li, ol li {
  line-height: 1.5;
  padding: 0.5em 0;
}


/*　     ボタン　　　　　　*/

.btn-gradient-3d-orange {
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  border-radius: 4px;
  color: #ffffff;
  background-image: linear-gradient(45deg, #FFC107 0%, #ff8b5f 100%);
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
  border-bottom: solid 3px #c58668;
}

.btn-gradient-3d-orange:active {
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
  border-bottom: none;
}


@media screen and (min-width:768px) {
img {
	max-width: 50%;
	height: auto;
	background: #ffffff;
	padding-bottom:20px;
	padding-right:20px;
        float:left;
}

h2 {
	clear:both; 
}




}





}