/*-------------------  width CSS  -------*/
.wid_10pa	{width:10%;}
.wid_166pa	{width:16.666%;}
.wid_20pa	{width:20%;}
.wid_25pa	{width:25%;}
.wid_33pa	{width:33.333%;}
.wid_30pa	{width:30%;}
.wid_40pa	{width:40%;}
.wid_50pa	{width:50%;}
.wid_60pa	{width:60%;}
.wid_70pa	{width:70%;}
.wid_80pa	{width:80%;}
.wid_90pa	{width:90%;}
.wid_100pa {width:100%;}
.wid_100px {width:100px;}
.wid_150px {width:150px;}
.wid_200px {width:200px;}
.wid_250px {width:250px;}
.wid_300px {width:300px;}
.wid_350px {width:350px;}
.wid_400px {width:400px;}
.wid_450px {width:450px;}
.wid_500px {width:500px;}
.wid_600px {width:600px;}
.wid_700px {width:700px;}
.wid_800px {width:800px;}
.wid_900px {width:900px;}
.wid_1000px {width:1000px;}
.wid_5em {width:5em;}
.wid_8em {width:8em;}
.wid_10em {width:10em;}
.wid_12em {width:12em;}
.wid_15em {width:15em;}
.wid_17em {width:17em;}
.wid_18em {width:18em;}
.wid_20em {width:20em;}
.wid_24em {width:24em;}
.wid_26em {width:26em;}
.wid_28em {width:28em;}
.wid_30em {width:30em;}
.wid_50em {width:50em;}
.hei_auto {height:auto;}
.hei_100px {height:100px;}
.hei_150px {height:150px;}
.hei_200px {height:200px;}
.hei_250px {height:250px;}
.hei_300px {height:300px;}
.hei_3em {height:3em;}
.hei_4em {height:4em;}
.hei_5em {height:5em;}
/*-----ボックスシャドーCSS------------------*/

/*-----ボックスCSS------------------*/
/*.rbox5 {
	border:solid 2px #FF0AF3;*/
/*枠線をボックスから少し離したようなデザイン	*/
.box_box-shadow {
    background-color: #cafbce;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px #cafbce;
    color: #0a8915;
    margin: 2em 2em;
    padding: 2em;
}
/*可愛さを演出するステッチ風デザイン*/
.box_border-radius_box-shadow {
    background-color: #8d1e47;
    border: 2px dashed #fff;
    border-radius: 8px;
    box-shadow: 0 0 0 4px #8d1e47;
    color: #fff;
    margin: 2em 2em;
    padding: 2em;
}
/*紙の端を折り返したようなドッグイヤー風デザイン*/
.dog_year {
    background-color: #c85d05;
    color: #fff;
    margin: 2em 0;
    padding: 2em;
    position: relative;
}
.dog_year::after {
    content: "";
    border-color: #853e04 #fff #fff #853e04;
    border-style: solid;
    border-width: 0 0 24px 24px;
    bottom: 0;
    position: absolute;
    right: 0;
}
/*------------タイトルを付けたボックス-----------*/
.box_title {
    border: 2px solid red;
    border-radius: 4px;
    margin: 2em 0;
    padding: 2em;
    position: relative;
    font-weight:900;
}
.box_title::before {
	content: "POINT";
    background-color: white;
    color: #da4033;
    font-weight: bold;
    left: 1em;
    padding: 0 .5em;
    position: absolute;
    top: -1em;
}

/*--------------かわいいもこもこの囲い--------------*/
.mokomoko {
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  left: 6rem;
  right: 6rem;
  width: 15rem;
  height: 9rem;
  line-height: 10rem;
  background: linear-gradient(rgba(21, 255, 165, 0.1) 1px, rgba(21, 255, 165, 0) 2px) center;
  background-size: .5rem .5rem;
  background-color: white;
  text-align: center;
  font-size: 1em;
  font-family: 'Great Vibes', cursive;
  color: darkturquoise;
  text-shadow: 0 1px 0 white, 0 -1px 0 white, 1px 0 0 white, -1px 0 0 white, 0 2px 0 white, 0 -2px 0 white, 2px 0 0 white, -2px 0 0 white, 0 3px 0 #15ffa5, 0 4px 0 darkturquoise;
}
.mokomoko:before {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  top: -.5rem;
  bottom: -.5rem;
  left: -.5rem;
  right: -.5rem;
  background: radial-gradient(circle, #ffffff 70%, rgba(0, 0, 0, 0) 75%);
  background-size: 1rem 1rem;
}
.mokomoko:after {
  content: "";
  display: block;
  position: absolute;
  z-index: -2;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  box-shadow: 0 0 35px #00696b;
}
/*-----シェイプCSS------------------*/
/*-----丸型------------------*/
.circle10 {
	width: 10px;
	height: 10px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
.circle20 {
	width: 20px;
	height: 20px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
/*-----星型------------------*/
.star-five100 {
   margin: 50px 0;
   position: relative;
   display: block;
   color: red;
   width: 0px;
   height: 0px;
   border-right:  100px solid transparent;
   border-bottom: 70px  solid red;
   border-left:   100px solid transparent;
   -moz-transform:    rotate(35deg);
   -webkit-transform: rotate(35deg);
   -ms-transform:     rotate(35deg);
   -o-transform:      rotate(35deg);
   
}
.star-five100:before {
   border-bottom: 80px solid red;
   border-left: 30px solid transparent;
   border-right: 30px solid transparent;
   position: absolute;
   height: 0;
   width: 0;
   top: -45px;
   left: -65px;
   display: block;
   content: '';
   -webkit-transform: rotate(-35deg);
   -moz-transform:    rotate(-35deg);
   -ms-transform:     rotate(-35deg);
   -o-transform:      rotate(-35deg);
}
.star-five100:after {
   position: absolute;
   display: block;
   color: red;
   top: 3px;
   left: -105px;
   width: 0px;
   height: 0px;
   border-right: 100px solid transparent;
   border-bottom: 70px solid red;
   border-left: 100px solid transparent;
   -webkit-transform: rotate(-70deg);
   -moz-transform:    rotate(-70deg);
   -ms-transform:     rotate(-70deg);
   -o-transform:      rotate(-70deg);
   content: '';
}
/*-----ハート型------------------*/
.heart100 {
    position: relative;
    width: 100px;
    height: 90px;
}
#heart100:before,
#heart100:after {
    position: absolute;
    content: "";
    left: 50px;
    top: 0;
    width: 50px;
    height: 80px;
    background: カラーコード;
    -moz-border-radius: 50px 50px 0 0;
    border-radius: 50px 50px 0 0;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
}
#heart100:after {
    left: 0;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
       -moz-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
         -o-transform-origin: 100% 100%;
            transform-origin :100% 100%;
}
/*-----五角形型------------------*/
.gokakukei {
  background: red;
  display: inline-block;
  height: 55px;
  margin-left: 20px;
  margin-top: 55px;
    position: relative;
    width: 100px;
}
.gokakukei:before {
  border-bottom: 35px solid red;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  top: -35px;
  width: 0;
}
          
/*-----ベース型------------------*/
.base {
  background: red;
  display: inline-block;
  height: 35px;
  margin-left: 0px;
  margin-top: 0px;
  position: relative;
  width: 46px;
  text-align:center;
  }
.base:after {
  border-top: 15px solid red;
  border-left: 23px solid transparent;
  border-right: 23px solid transparent;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  top: 35px;
  width: 0;
}
.base2 {
	background: black;
	display: inline-block;
	height: 29px;
	margin-left: 0px;
	margin-top: 4px;
	position: relative;
	width: 38px;
	color: white;
	text-align: center;
	font-size: 34px;
	vertical-align: middle;
	line-height: 50px;
	font-weight: 900;
	z-index: 1;
	border: 1px solid blue;
  }
.base2:after {
  border-top: 10px solid black;
  border-left: 19px solid transparent;
  border-right: 19px solid transparent;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  top: 29px;
  width: 0;
  z-index:1;
}
/*------------ 吹き出しCSS Document ------------*/
/*吹き出し赤*/
.hukidasi_red_r,.hukidasi_red_l,.hukidasi_red_b,.hukidasi_red_t{
	border-color:#FF0000;
	border-width:2px;
	border-style:solid;
	border-radius: 10px;
	position: relative;
	padding: 10px;
}
/*右向き*/
.hukidasi_red_r:before {
content: "";
	position: absolute;
	top: 20%; right: -8px;
	margin-top: -8px;
	display: block;
	border-style: solid;
	border-width: 10px 0 10px 10px;
	border-color: transparent transparent transparent #ffffff;
	z-index: 0;
}
.hukidasi_red_r:after {
content: "";
	position: absolute;
	top: 20%; right: -10px;
	margin-top: -8px;
	display: block;
	border-style: solid;
	border-width: 10px 0 10px 10px;
	border-color: transparent transparent transparent #FF0000;
	z-index: -1;
}
/*左向き*/
.hukidasi_red_l:before {
content: "";
	position: absolute;
	top: 20%; left: -8px;
	margin-top: -8px;
	display: block;
	border-style: solid;
	border-width: 10px 10px 10px 0px;
	border-color: transparent #ffffff transparent transparent;
	z-index: 0;
}
.hukidasi_red_l:after {
content: "";
	position: absolute;
	top: 20%; left: -10px;
	margin-top: -8px;
	display: block;
	border-style: solid;
	border-width: 10px 10px 10px 0px;
	border-color: transparent #FF0000 transparent transparent;
	z-index: -1;
}
/*下向き*/
.hukidasi_red_b:before {
	border-color:#fff transparent transparent;
	border-style:solid;
	border-width:10px 10px 0;
	bottom:-8px;
	content:"";
	display:block;
	left:50%;
	position:absolute;
	width:0;
	z-index:1;
}
.hukidasi_red_b:after {
	border-color:#FF0000 transparent transparent;
	border-style:solid;
	border-width:10px 10px 0;
	bottom:-10px;
	content:"";
	display:block;
	left:50%;
	position:absolute;
	width:0;
}
/*上向き*/
.hukidasi_red_t:before {
content: "";
	position: absolute;
	top: -8px; left: 50%;
	margin-left: -8px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 10px 10px;
	border-color: transparent transparent #FFFFFF transparent;
	z-index: 0;
}
.hukidasi_red_t:after {
content: "";
	position: absolute;
	top: -11px; left: 50%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #FF0000 transparent;
	z-index: -1;
}
/*吹き出し青*/
.hukidasi_blue_r,.hukidasi_blue_l,.hukidasi_blue_b,.hukidasi_blue_t{
	border-color:#FF0000;
	border-width:2px;
	border-style:solid;
	border-radius: 10px;
	position: relative;
	padding: 10px;
}
/*右向き*/
.hukidasi_blue_r:before {
content: "";
	position: absolute;
	top: 20%; right: -8px;
	margin-top: -8px;
	display: block;
	border-style: solid;
	border-width: 10px 0 10px 10px;
	border-color: transparent transparent transparent #ffffff;
	z-index: 0;
}
.hukidasi_blue_r:after {
content: "";
	position: absolute;
	top: 20%; right: -10px;
	margin-top: -8px;
	display: block;
	border-style: solid;
	border-width: 10px 0 10px 10px;
	border-color: transparent transparent transparent #0000FF;
	z-index: -1;
}
/*左向き*/
.hukidasi_blue_l:before {
content: "";
	position: absolute;
	top: 20%; left: -8px;
	margin-top: -8px;
	display: block;
	border-style: solid;
	border-width: 10px 10px 10px 0px;
	border-color: transparent #ffffff transparent transparent;
	z-index: 0;
}
.hukidasi_blue_l:after {
content: "";
	position: absolute;
	top: 20%; left: -10px;
	margin-top: -8px;
	display: block;
	border-style: solid;
	border-width: 10px 10px 10px 0px;
	border-color: transparent #0000FF transparent transparent;
	z-index: -1;
}
/*下向き*/
.hukidasi_blue_b:before {
	border-color:#fff transparent transparent;
	border-style:solid;
	border-width:10px 10px 0;
	bottom:-8px;
	content:"";
	display:block;
	left:50%;
	position:absolute;
	width:0;
	z-index:1;
}
.hukidasi_blue_b:after {
	border-color:#0000FF transparent transparent;
	border-style:solid;
	border-width:10px 10px 0;
	bottom:-10px;
	content:"";
	display:block;
	left:50%;
	position:absolute;
	width:0;
}
/*上向き*/
.hukidasi_blue_t:before {
content: "";
	position: absolute;
	top: -8px; left: 50%;
	margin-left: -8px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 10px 10px;
	border-color: transparent transparent #FFFFFF transparent;
	z-index: 0;
}
.hukidasi_red_t:after {
content: "";
	position: absolute;
	top: -11px; left: 50%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #0000FF transparent;
	z-index: -1;
	}
/*
==================================================
特注品
==================================================
*/
.txt_red{color:#FF0000;}
.txt_blue{color:#0000ff;}
span.txtbg_yellow{
    background-color: #FFFF00;
    font-weight: bold;
    padding: 2px;}

.bg__img_orange {
    background-image: url(../img/bg_img_orange.gif);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 12px 14px 8px 16px;
    margin:20px 0;
}
.bg__img_yellow {
    background-image: url(../img/bg_img_yellow.gif);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 12px 14px 8px 16px;
    margin:20px 0;
}
.bg__img_green {
    background-image: url(../img/bg_img_green.gif);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 12px 14px 8px 16px;
    margin:20px 0;
}
.good {
    background: url(../img/good.png) 4px center no-repeat;
    padding: 20px 0 15px 60px;
    color: #EF3174;
    background-size: 50px;
}
.smile {
    background: url(../img/smile.png) 4px center no-repeat;
    padding: 20px 0 15px 60px;
    color: #e88a01;
    background-size: 50px;
}
.ase {
    background: url(../img/ase.png) 4px center no-repeat;
    padding: 20px 0 15px 60px;
    color: #5aa0c3;
    background-size: 50px;
}
dd.kasen {
    border-bottom: dotted 2px #ccc;
    margin-bottom: 3.48837%;
    padding-bottom: 3.48837%;
    padding-left: 25px;
}

body{
user-select:none;
-moz-user-select:none;
-webkit-user-select:none;
-webkit-user-drag:none;
-khtml-user-select:none;
-khtml-user-drag:none;
}

@media screen and (max-width: 899px) {
}
@media screen and (max-width: 640px) {
/*-----------------  box width CSS  ---------*/

}
