@charset "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Asap+Condensed:600');



/*@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.3.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.3.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.3.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.3.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
*/



/*additional reset
---------------------------------------------------*/
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

body.safari #content, body.safari #footer {/*サファリでリンク先から戻った時文字が拡大する対応*/
    -webkit-text-size-adjust: 100%;
}



/** link **/

a:link {
    color: #1c7fbd;
	text-decoration: underline;
}

a:visited {
    color: #1c7fbd;
}

a:hover,
a:active {
	text-decoration: none;
}
.taC{
    text-align: center;
}
.caution_txt{
    text-align:right;
    font-size:0.7em;
}
.footer a {
    color: #999!important;
}


.marker2{
	background: linear-gradient(transparent 60%, #fdfb70 0%);
}
h5{
	font-size: 1.3rem;
}


/*初期設定
----------------------------------------------------*/
#rapper{
	width: 100%;
	padding: 0 0 0 0;
	overflow: hidden;
	color: #222;
	background: #fff;
}




#content {
	margin:0 auto;
	width: 700px;
	text-align: left;
	background-color: #fff;
	padding:15px 30px;
}

.content-main{
	/*width: 700px;*/
}

img.pics {
	max-width: 100%;
}

img.pics1 {
	max-width: 100%;
    margin-top: 10px;
    margin-bottom: 20px;
}

img.pics3 {
	max-width: 100%;
    margin-bottom: 20px;
}

img.pics4 {
    max-width: 100%;
    margin-bottom: 0px;
}

img.pics5 {
	max-width: 100%;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 0px;
}

.ie8 img{
	width: auto;
}
.fsS{
	font-size: 0.7em;
	vertical-align: top;
}
h6 {
    padding: 10px 0;
    font-size: 1.3em;
    font-weight: bold;
    line-height: 1.3;
    margin-bottom: 10px;
    border-bottom: 2px solid #78BADC;
    border-left: 3px solid #78BADC;
    padding-left: 15px;
}

.mb0{
    margin-bottom: 5px;
}

.choice {
    border: 2px solid #78BADC;
    padding: 5px 5px 0 5px;
    border-radius: 0.5em;
    margin-bottom: 1em;
}
.brown {
    color: #78BADC;
}
.fwB{
	font-weight: bold;
}
.choice2 {
    font-size: 14px;
    margin-bottom: 10px;
}
p.choice2 {
    margin-bottom: 10px;
        line-height: 1.3;
}
hr {
    line-height: 1;
}



/*clearfix*/
.clearfix2 {
  clear: both;
  zoom: 1;
}

.clearfix3:after {
  content: "";
  display: block;
  clear: both;
}
.buruburu {
    animation: hurueru .2s  infinite;
}

.box26 {
    position: relative;
    margin: 2em 0;
    padding: 1em;
    border: 3px solid #FFC23F;
    border-radius: 8px;
}
.box26 p{
	margin: 0!important;
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    font-weight: bold;
}


.animate {
    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    -ms-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.animate69, .a-btnsub69, .a-option69 {
    animation-duration: 1.4s!important;
    -webkit-animation-duration: 1.4s;
    -ms-animation-duration: 1.4s;
    -moz-animation-duration: 1.4s!important;
}
.animate69 {
    -webkit-animation-name: animate69;
    -moz-animation-name: animate69;
    -o-animation-name: animate69;
    animation-name: animate69;
}

@keyframes animate69{
    
    0% {
        transform: skewX(9deg);
    }
    10% {
        transform: skewX(-8deg);
    }
    20% {
        transform: skewX(7deg);
    }
    30% {
        transform: skewX(-6deg);
    }
    40% {
        transform: skewX(5deg);
    }
    50% {
        transform: skewX(-4deg);
    }
    60% {
        transform: skewX(3deg);
    }
    70% {
        transform: skewX(-2deg);
    }
    80% {
        transform: skewX(1deg);
    }
    90% {
        transform: skewX(0deg);
    }
    100% {
        transform: skewX(0deg);
    }

    align-content:normal;
    align-items:normal;
    align-self:
    
}


@keyframes hurueru {
    0% {transform: translate(0px, 0px) }
    25% {transform: translate(2px, 0px)}
    50% {transform: translate(0px, 0px)}
    75% {transform: translate(0px, 2px) }
    100% {transform: translate(0px, 0px) }
}
/*layout
----------------------------------------------------*/

#header{
	height: 85px;
	border-bottom: 1px solid #eee;
 position: relative;
}



.brand{
	position: absolute;
	top:20%;
	display: block;
	width: 100%;
	font-family: 'Asap Condensed', sans-serif;
	color: #222;
	font-size: 30px;
	text-align: center;
}

h1{
	font-size: 32px;
	font-weight: 700;
	line-height: 1.3125;
padding: 20px 0;
}



h2{
	padding:10px 0;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.3;
	margin-bottom: 20px;
}

.title1{border-bottom: 3px solid #78BADC;}
.title2{border-bottom: 3px solid #78BADC;}
.title3{border-bottom: 3px solid #78BADC;}

h3{
	padding:10px 0;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.3;
	margin-bottom: 10px;
    border-bottom: 2px solid #78BADC;

}

/*accordion*/

.close {
    display: none;
    margin:0 auto;
}
.OaC_btn {
    display: block;
    margin: 0 auto;
    width: 80%;
    height: 50%;
    padding: 1.2%;
    text-decoration: none;
    background: #4fabda;
    text-align: center;
    color: #FFFFFF;
    font-size: 20px;
    font-style: oblique;
    border-radius: 5px;
    margin-bottom: 30px;
}
.OaC_btn:last-letter{
    font-size:12px;
    vertical-align:middle;
}
.center {
    text-align: center;
}  

section{
    display: block;
}


h7{
	display: block;
	background: #78BADC;
	padding: .3em;
	font-size: 1.5em;
	margin: 20px auto;
	color: #fff;
	font-weight: bold;
	text-align: center;
}


p{
	margin-bottom: 20px;
	word-wrap: break-word;
}

.pics{
	margin-bottom: 10px;
}


.fcP{
    color:#002eb0;
}
.ttl{
    text-align: center;
	margin-bottom: 0!important;
}
.table-wrap table img{
   max-width: 100%;
}
.wrighter_box{
    padding: 10px 2% 5px;
    background: #efffff;
    margin-bottom: 20px;
}
.wrighter{
    width: 100%;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;

}
.wrighter p:first-child{
    width: 25%;

}
.wrighter p:last-child{
    width: 70%;

}

.fwB{
    font-weight: bold;
}

figure{
	margin-bottom: 20px;
}
figcaption{
	font-size: .8em;
	color: #999;
}
.btn{
    width:70%;
    height:50px;
    line-height:50px;
    margin: 0 auto 50px;
}
.btn a{
    display:block;
    width:100%;
    height:100%;
    text-decoration: none;
    background:#FFA500;
    text-align:center;
    color:#FFFFFF;
    font-size:18px;
    font-style:oblique;
    box-shadow: 3px 3px 0px 0px #FF8C00;
    border-radius: 5px;
}

	margin-bottom: 0;
}

/*各商品表 追加*/
.spec {
    margin-bottom: 30px;
}
.spec table {
    margin-top: 1.5em;
    margin-bottom: 0.2em;
    width: 100%;
}
.spec table tr {
    background-color: #f5f3f2;
    padding: .35em;
    border-bottom: 2px solid #fff;
}
.spec table tr:first-child th {
    font-weight: bold;
}
.spec table th:first-child {
    padding: 1em .3em;
    border: 2px solid #fff;
    width: 25%;
    font-weight: bold;
}
.spec table tbody th {
    background: #78BADC;
    color: #fff;
}
.spec table th {
    font-size: .8em;
    text-align: center;
}
.spec table td {
    /* padding: 1em 10px 1em 1em; */
    border-right: 2px solid #fff;
    background-color: #f3f3f3;
    font-size: .85em;
	    vertical-align: middle;
}
.fcY{
	color: #ffd700;
}

/*VIOTERAS Cセラム のm0*/
.m0{
    margin-bottom: 10px;
}

/*口コミ*/
.review {
    border: solid 2px #78BADC;
    width: 100%;
    padding-bottom: 0%;
    margin: 0 0 20px;
}
.swiper-wrapper img {
    margin: 0 auto;
    display: block;
    margin-bottom: 45px;
    filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
}
.swiper-pagination-bullet-active {
    opacity: 1;
    background: #ffdbdd !important;
}

.swiper-slide swiper-slide-active{
    width: 636px;
}
#content .review.kuchikomi p{
    line-height: 1.2rem;
    margin-top: 10px;
}
.swiper-slide.swiper-slide-duplicate.swiper-slide-prev {
    width: 636px;
}

.swiper-button-prev img{
    width: 80%;
}
.swiper-button-next img{
    width: 80%;
}




@media only screen and (min-width:640px){
    .pc{
     display:block;
    }
    .sp{
     display:none;
    }
}
@media only screen and (max-width:640px){
    .pc{
     display:none;
    }
    .sp{
     display:block;
    }
	h7{
	font-size: 1.2em;
		padding: 3px;
}
}
@media only screen and (max-width:839px){
    .wrighter p:last-child{
        font-size: 0.7em;

    }
    .ttl{
        text-align: center;
        font-size: 1em;
    }
    .btn{
        width:100%;
        height:50px;
        line-height:50px;
        margin: 0 auto 50px;
    }
}
.box-voice{
	display: flex;
}

.gray-box{
	/*border: 1px solid #eee;
	background: #f9f9f9;*/
	padding: 1em;
	color: #555;
	margin-bottom: 20px;
	word-wrap: break-word;
	font-size: .90em;
}
.gray-box{
	font-weight:bold;
}
.gray-box p, .gray-box figure{
	margin-bottom: 0px;
}

.gray-box a{
	display: inline-block;
	text-decoration: none;
	border: none;
	padding: .5em 1em;
	background: #287ab7;
	border-radius: 10px;
	border: 2px solid #0981b5;
	color: #015281;
	font-size: 1.2em;
	font-weight: 700;
	line-height: 1.2;
    text-shadow:
    0 0 25px #edf8ff,
    0 0 20px #edf8ff,
    0 0 0.40px #edf8ff;
    text-align: center;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#b7deed+0,71ceef+50,21b4e2+51,b7deed+100;Shape+1+Style */
    background: #b7deed; /* Old browsers */
    background: -moz-linear-gradient(top, #b7deed 0%, #71ceef 50%, #21b4e2 51%, #b7deed 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #b7deed 0%,#71ceef 50%,#21b4e2 51%,#b7deed 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #b7deed 0%,#71ceef 50%,#21b4e2 51%,#b7deed 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7deed', endColorstr='#b7deed',GradientType=0 ); /* IE6-9 */
}
.gray-box_orange a {
    display: inline-block;
    text-decoration: none;
    border: none;
    padding: .5em 1em;
    border-radius: 10px;
    border: 2px solid #ff7a1d;
    color: #f56c0d;
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1.2;
    text-shadow: 0 0 25px #fff4ed, 0 0 20px #fff4ed, 0 0 0.4px #fff4ed;
    text-align: center;
    background: #b7deed;
    background: linear-gradient(to bottom, #edd2b7 0%,#ffe1b3 50%,#f3a76f 51%,#edd7b7 100%);
    background: -webkit-linear-gradient(to bottom, #edd2b7 0%,#ffe1b3 50%,#f3a76f 51%,#edd7b7 100%);
    background: -moz-linear-gradient(to bottom, #edd2b7 0%,#ffe1b3 50%,#f3a76f 51%,#edd7b7 100%);
}
.gray-box_green a {
    display: inline-block;
    text-decoration: none;
    border: none;
    padding: .5em 1em;
    background: #287ab7;
    border-radius: 10px;
    border: 2px solid #01811e;
    color: #01811e;
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1.2;
    text-shadow: 0 0 25px #edffee, 0 0 20px #edffee, 0 0 0.4px #edffee;
    text-align: center;
    background: #b7deed;
    background: -moz-linear-gradient(top, #b7deed 0%, #71ceef 50%, #21b4e2 51%, #b7deed 100%);
    background: -webkit-linear-gradient(top, #b7deed 0%,#71ceef 50%,#21b4e2 51%,#b7deed 100%);
    background: linear-gradient(to bottom, #dfffe1 0%,#71ef7b 50%,#54e43b 51%,#b7edbb 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7deed', endColorstr='#b7deed',GradientType=0 );
}
.compare-box{
	font-size: 18px;
	line-height: 30px;
}
.compare-box p{
	display: inline-flex;
	flex-wrap:wrap;
}
.compare-box span{
	word-break: keep-all;
}


.user-name{
	color: #fea3cc;
}

#content a.cv-link:link,
#content a.cv-link:visited,
#content a.cv-link:hover,
#content a.cv-link:active
{
	font-size:24px;
	color: #13b5b1;
	font-weight: bold;
}

ul,li{
	list-style: disc;
}


ul.points{
	border:1px solid #eee;
	background: #f9f9f9;
	margin:0px 0 10px;
	padding: 1em 1em 1em 2em;
	font-size: .9em;
}

/*ランキング表*/
.back{
	background: #fffde8!important;
	font-weight: bold;
}
.back1{
	background: #fffde8!important;
}
.fsS{
	font-size: .5em;
}
.ranking-paragraph{
	display: none;
}
.rankTable {
    background:#D5F3F9;
    width: 100%;
    margin: 0 auto 3%;
    box-sizing: border-box;
    padding-bottom: 10px;
}
.rankTable table {
    background: #ffffff;
    width: 97%;
    margin: auto;
    box-sizing: border-box;
    padding: 1%;
    border-radius: 5px;
}
.rankTable table tr th {
    background: #78BADC;
    color: #fff;
    border-radius: 0;
    /*	padding: 0.5% 0;*/
    font-weight: bold;
}
.rankTable table tr:first-child th,
.rankTable table tr:last-child th {
    background: #ffffff;
    border-radius: 0;
    padding: 3% 0;
    font-size: 1.5rem;
    vertical-align: top;
    line-height: 1;
    border-right: 2px dotted #c4c4c4;
}
.rankTable table tr:first-child th:last-child,
.rankTable table tr:last-child th:last-child {
    border-right: none;
}
.rankTable table tr:first-child th:nth-child(1){
    color: #dba728;
    text-align: center;
}
.rankTable table tr:first-child th:nth-child(2) {
    color: #9d9a93;
    text-align: center;
}
.rankTable table tr:first-child th:nth-child(3) {
    color: #c56e6e;
    text-align: center;
}

.rankTable table tr:last-child th:nth-child(1){
    color: #dba728;
    text-align: center;
}
.rankTable table tr:last-child th:nth-child(2) {
    color: #9d9a93;
    text-align: center;
}
.rankTable table tr:last-child th:nth-child(3) {
    color: #c56e6e;
    text-align: center;
}
.rankTable table tr:first-child th:nth-child(4) {
    color: #74cccc;
    text-align: center;
}
.rankTable table tr:first-child th:nth-child(5){
    color: #74cccc;
    text-align: center;
}
.rankTable table tr:first-child th:nth-child(6){
    color: #74cccc;
    text-align: center;

}
.rankTable table tr:last-child th:nth-child(4) {
    color: #74cccc;
    text-align: center;

}
.rankTable table tr:last-child th:nth-child(5){
    color: #74cccc;
    text-align: center;

}
.rankTable table tr:last-child th:nth-child(6){
    color: #74cccc;
    text-align: center;
}
.rankTable table tr:first-child th a,
.rankTable table tr:last-child th a {
    font-size: 1rem;
}
.rankTable table tr:first-child th a img,
.rankTable table tr:last-child th a img {
    padding: 5% 0;
	width: 95%;
}


.rankTable td {
    border-right: 2px dotted #c4c4c4;
    text-align: center;
    padding: 3% 1%;
    width: calc(100% / 5);
    font-size: 0.8rem;
    vertical-align: top;
}
.rankTable td:last-child {
    border-right: none;
}
td.txt_only {
    font-size: 1.5rem;
    color: #333333;
    padding: 2.5% 0;
}
span.ex, span.go, span.so, span.ba {
    font-weight: normal;
    line-height: 70px;
}
span.ex {
    font-size: 5rem;
    color: #f8525d;
}
span.go {
    font-size: 3.5rem;
    color: #7cd0dd;
}
span.so {
    font-size: 3.2rem;
    color: #f5c132;
}
span.ba {
    font-size: 4rem;
    color: #7a7a7a;
}
span.txt_ex {
    font-weight: bold;
    color: #f8525d;
}
/*.scrollok {
display: none;
}*/

span.ex, span.go, span.so, span.ba {
    line-height: 50px;
}
span.ex {
    font-size: 3.5rem;
}
span.go {
    font-size: 2.5rem;
}
span.so {
    font-size: 2.2rem;
}span.ba {
    font-size: 3rem;
}
.rankTable table tr th {
    text-align: center;
    font-size: 1rem;
}
.table-wrap table img {
    max-width: 100%;
}



.w90{
    width:90%;
}


@media only screen and (max-width: 839px){
	.ranking-paragraph{
	display: block;
}
       .rankTable {
        /*padding: 20px 0 0 0;*/
        border: 10px solid #D5F3F9;
        border-top: 10px solid #D5F3F9;
        border-width: 10px;
        /*overflow-x: scroll;*/
        width: 100%;
        box-sizing: border-box;
        margin: 0 0 20px 0;
        background: #ffffff;
    }
    .rankTable.sp_scroll{
        border: 10px solid #D5F3F9;
        width: 100%;
        box-sizing: border-box;
        margin: 0 0 20px 0;
        background: #ffffff;
        overflow: scroll;
        
    }
    
    .rankTable table {
        width: 100%;
    }
    .rankTable.sp_scroll table {
        width: 640px;
    }
    .rankTable table tr.sp_th {
        /*display: block;*/
        height: 28px;
    }
   
    .rankTable table tr.sp_th th {
        /*	position: absolute;*/
        left: 0;
        right: 0;
        margin: auto;
        width: calc(100% - 20px);
        text-align: center;
        padding-top: 5px;
    }
 
    .rankTable.sp_scroll table tr.sp_th th {
        	position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        width: calc(100% - 50px);
        text-align: center;
        padding-top: 5px;
    }
    .scrollok {
        display: block;
        text-align: center;
        color: #0b4685;
        /*position: absolute;*/
        right: 0;
        left: 0;
        background: #edf5fa;
        width: 100%;
        margin: auto;
    }
    span.ex, span.go, span.so, span.ba {
        line-height: 50px;
    }
    span.ex {
        font-size: 3.5rem;
    }
    span.go {
        font-size: 2.5rem;
    }
    span.so {
        font-size: 2.2rem;
    }span.ba {
        font-size: 3rem;
    }
    .rankTable table tr th {
        font-size: 1rem;
    }


}

.pink_star{
    color: #F48EA1;
}
/*ランキング表*/








.post-date{
	color: #aaa;
	padding: .5em;
	font-size: 12px;
}


.customer-voice{
	padding: 16px;
	background: #ffefe9;
	margin-bottom: 20px;
}



/*SNS指定*/
.sns a:link,
.sns a:visited,
.sns a:hover,
.sns a:active {
	color: #fff;
	text-decoration: none;
	border-bottom: none;
}

.sns ul{
	display: flex;
	flex-flow: wrap;
	margin: 20px 0;
}
.sns li{
	display: flex;
	min-width: 50px;
	margin-right: 10px;
}

.sns ul li .fa-hatebu:before {
    content: "B!";
    font-family: Verdana;
    font-weight: bold;
    font-style: normal;
}

.sns_icon {
	width: 130px;
	height: 40px;
	border-radius: 4px;
	font-size: 14px;
	font-weight: bold;
	padding: 9px 0;
	text-align: center;
	margin-bottom: 10px;
}
.sns_icon a:link,
.sns_icon a:hover,
.sns_icon a:active,
.sns_icon a:visited {
		color: #fff;

}
.sns .vsbl-mb{margin-left: .2em;}

.facebook_back{
	background-color: #305097;
}

.twitter_back{
	background-color: #55acee;
}

.google_back{
	background-color: #db4a39;
}

.hatena_back{
	background-color: #00a4de;
}
.sns_line{width: 130px; height: auto;}



/*----------- スライダー ------------*/


/*画像ブロック*/
#main-gallery{
	width: 100%;
	height: auto;
	position: relative;
  margin-bottom:20px;
}


/*３枚画像の共通設定*/
#slide1,#slide2,#slide3 {
	-webkit-animation-duration: 10s;	/*実行する時間。「s」は秒の事。*/
	animation-duration: 10s;			/*同上*/
	-webkit-animation-iteration-count:infinite;	/*実行する回数。「infinite」は無限に繰り返す意味。*/
	animation-iteration-count:infinite;			/*同上*/
}

/*slide1*/
#slide1 {
	-webkit-animation-name: slide1;		/*上で設定しているキーフレーム（keyframes）の名前*/
	animation-name: slide1;				/*同上*/
	position: relative;
	width: 100%;
	height: auto;
}

/*slide2*/
#slide2 {
	-webkit-animation-name: slide2;		/*上で設定しているキーフレーム（keyframes）の名前*/
	animation-name: slide2;				/*同上*/
	position: absolute;
	left:0px;
	top:0px;
	width: 100%;
	height: auto;
}

/*slide3*/
#slide3 {
	-webkit-animation-name: slide3;		/*上で設定しているキーフレーム（keyframes）の名前*/
	animation-name: slide3;				/*同上*/
	position: absolute;
	left:0px;
	top:0px;
	width: 100%;
	height: auto;
}


/*slide1*/
@keyframes slide1 {
	0% {opacity: 0;}
	10% {opacity: 1;}
	30% {opacity: 1;}
	40% {opacity: 0;}
	100% {opacity: 0;}
}

/*slide2*/
@keyframes slide2 {
	0% {opacity: 0;}
	30% {opacity: 0;}
	40% {opacity: 1;}
	60% {opacity: 1;}
	70% {opacity: 0;}
	100% {opacity: 0;}
}

/*slide3*/
@keyframes slide3 {
	0% {opacity: 0;}
	60% {opacity: 0;}
	70% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}
/*ボタン*/
.btn-box{
	margin:20px auto 40px;
	text-align: center;
	/*width: 300px;*/
}
.btn-box img{
	max-width: 100%;
}

a.btn{
	text-decoration: none;
	display: inline-block;
	border: none;
	width: 100%;
	padding: .8em 1em;
	background: #287ab7;
	border-radius: 10px;
	border: 2px solid #0981b5;
	color: #00479d;
	font-size: 1.2em;
	font-weight: 700;
text-shadow:
0 0 25px #edf8ff,
0 0 20px #edf8ff,
0 0 0.40px #edf8ff;
	text-align: center;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#b7deed+0,71ceef+50,21b4e2+51,b7deed+100;Shape+1+Style */
background: #b7deed; /* Old browsers */
background: -moz-linear-gradient(top, #b7deed 0%, #71ceef 50%, #21b4e2 51%, #b7deed 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #b7deed 0%,#71ceef 50%,#21b4e2 51%,#b7deed 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #b7deed 0%,#71ceef 50%,#21b4e2 51%,#b7deed 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7deed', endColorstr='#b7deed',GradientType=0 ); /* IE6-9 */
}

.btn-box a:hover,
.btn-box a:active{
	opacity: .7;
	transition: 1s;
}

a.cvn{
	display: block;
	position: relative;
	/*padding-left: 20px;*/
}
/*.arw{
	display: block;
	position: absolute;
	top:40px;
	left:-20px;
	-webkit-animation: arwmove 1.2s infinite;
	animation: arwmove 1.2s infinite;
	z-index: 10;
	width: 76px;
}*/

img.btn{
	-webkit-animation: btnmove 2s infinite;
	animation: btnmove 2s infinite;
	z-index: 5;
}

@-webkit-keyframes arwmove {
	0% {left:-50px;}
	40% {left:-20px;}
	100% {left:-50px;}
}

@-webkit-keyframes btnmove {
	0% {transform: scale(1.0);}
	40% {transform: scale(1.05);}
	100% {transform: scale(1.0);}
}

@keyframes arwmove {
	0% {left:-50px;}
	40% {left:-20px;}
	100% {left:-50px;}
}

@keyframes btnmove {
	0% {transform: scale(1.0);}
	40% {transform: scale(1.05);}
	100% {transform: scale(1.0);}
}


/*共通パーツ*/
.ref{
	font-size: .8em;
	color: #999;
}
#content .mt40{
	margin-top: 40px;
}
#content .mt30{
	margin-top: 30px;
}
#content .mt20{
	margin-top: 20px;
}
#content .mt10{
	margin-top: 10px;
}
.mb20{margin-bottom: 20px;}
.pr10{padding-right: 10px;}
.ml20{margin-left: 20px;}

#content .pb30{padding-bottom: 30px;}
#content .tac{
	text-align: center;
}
#content .tar{
	text-align: right;
}

.red{
    color: #fa7c92;
	font-weight: bold;
}
.red2{
    color: red;
	font-weight: bold;
}

#content .light-pink{
	color: #fcccdf;
}
#content .pink{
	color: #fcccdf;
}

#content .blue{
	color: #002eb0;
}
.marker{
	background: linear-gradient(transparent 60%, #fdfb70 0%);
	font-size: 18px;
}

.box02 .box_title{
        color: red;
    font-weight: bold;
    text-align: center;
    font-size: 19px;
}
.box02{
        margin: 35px 0;
    border: solid 2px gray;
    padding: 15px;
    border-radius: 20px;
}

.fwb{
    font-weight:bold;
}

#content .uline{
	text-decoration: underline;
}

#content .black{
	color: #000;
	font-weight: bold;
}

.green{
	color: #009944;
}
.smaller{font-size: .8em;}

.gray{color: #ddd}

#content .wavy { background:url(../img/wavy.png) bottom repeat-x; }

#content .bld{
	font-weight: bold;
}
.tx-m{font-size: 14px;}
#content .tx-s{
	font-size: 12px;
}

.tx-l{font-size: 18px;}

#content .tx-19{font-size: 19px;}
#content .tx-24{font-size: 24px;}

.right{float:right;}

.show-sp{display: none !important;}
.show-br-sp{display: none;}

.blinking{
    -webkit-animation:0.5s linear 0s alternate none infinite running blink;
    -moz-animation:0.5s linear 0s alternate none infinite running blink;
    animation:0.5s linear 0s alternate none infinite running blink;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    19.9% { opacity: 0; }
    20% { opacity: 1; }
    100% { opacity: 1; }
}
@-moz-keyframes blink{
    0% {opacity:0;}
    19.9% { opacity: 0; }
    20% { opacity: 1; }
    100% { opacity: 1; }
}
@keyframes blink{
    0% {opacity:0;}
    19.9% { opacity: 0; }
    20% { opacity: 1; }
    100% { opacity: 1; }
}


.block-voice{
	margin:20px 0;
	padding: 30px 20px 20px 30px;

	background: #fefaf2 url(../img/quote.png) no-repeat 10px 10px;
	/*border: 1px solid #f2af29;*/
}

#footer a:link,
#footer a:hover,
#footer a:visited,
#footer a:active
{
	color: #fff;
}

#content .ref{font-size: 12px;}/*出典用*/
#content figcaption.ref a:link,
#content figcaption a:link,
#content figcaption a:hover,
#content figcaption a:active
{color: #666; text-decoration: underline;}





/*footer*/
#footer{
	padding: 30px 10px 0;
}


#footer p{
	text-align: center;
	color: #999;
	line-height: 1.5;
	font-size:12px;
}

#footer .tx-ss{
	font-size: 11px;
}


/*レスポンシブ用*/

/*@media only screen and (min-width:840px){*//*PC表示で反映させる設定*/
@media only screen and (min-width:840px){/*PC表示で反映させる設定*/
	.box-voice img{
		margin-right: 20px;
	}
	.box-voice p{margin-top: 20px;}
}

@media only screen and (max-width:999px){/*コンテンツ幅の調整*/
	#content{width: 100%;
		padding:15px;}

}


/*@media only screen and (max-width:839px){*//*スマホ表示で反映させる設定*/
@media only screen and (max-width:839px){/*スマホ表示で反映させる設定*/
    .content-main{width: 100%;}
	img.pics{width: 100%; height: auto;}
    img.pics2{width: 100%; height: auto;}
    .header-inner{width: 100%}
	h1{
	font-size: 20px;
padding: 10px 0 20px 0;
}
	h2{font-size: 18px;}
	h3{font-style: 17px;}
	.sns{display: none;}
	.box-voice{
	flex-direction: column;
	}
	.table-blue{width: 650px;}
	.table-wrap{
	width: 100%;
	overflow:auto;
	overflow-x:scroll;
	}
	.show-sp{display: block !important;}

  .acc_btn {
    display: block;
    width: 60%;
    text-align: center;
    padding: 10px;
    margin: 20px auto;
    background: #78BADC;
    color: #fff;
    letter-spacing: 0px;
}
.acc_btn_close {
	width: 100%;
	margin:0 auto;
  display: none;
}

}

.no1_linkbtn{
    display: none;
}
.table-wrap table th a{
    color: #fff;
}
@media only screen and (max-width:499px){/*ボタンの改行を調整*/
	.show-br-sp{display: inline-block;}
	.gray-box a,.gray-box_orange a,.gray-box_green a{width: 100%;}

}

.arrow{
position: relative;
display: inline-block;
padding: 0 0 0 16px;
color: #000;
vertical-align: middle;
text-decoration: none;
font-size: 15px;
}
.arrow::before,
.arrow::after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}
.arrow1::before{
left: 260px;
width: 21px;
height: 2px;
background: #ffffff;
	transition: all 0.8s ease;
}
.arrow1::after{
left: 260px;
width: 18px;
height: 18px;
border-top: 2px solid #ffffff;
border-right: 2px solid #ffffff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
	transition: all 0.8s ease;
}
.arrow1:hover::before{
left: 260px;
width: 21px;
height: 2px;
background: #2FAFB1;
	transition: all 0.8s ease;
}
.arrow1:hover::after{
left: 260px;
width: 18px;
height: 18px;
border-top: 2px solid #2FAFB1;
border-right: 2px solid #2FAFB1;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
	transition: all 0.8s ease;
}
@media only screen and (max-width:839px){
	.no1_linkbtn{
        display: block;
	position: fixed;
	right:0;
	bottom: 0;
	z-index: 5000;
	    width:100%;
}
    .no1_linkbtn img{
        width: 100%;
    }
.arrow{
position: relative;
display: inline-block;
padding: 0 0 0 16px;
color: #000;
vertical-align: middle;
text-decoration: none;
font-size: 15px;
}
.arrow::before,
.arrow::after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}
.arrow1::before{
left: 140px;
width: 14px;
height: 2px;
background: #ffffff;
	transition: all 0.8s ease;
}
.arrow1::after{
left: 140px;
width: 12px;
height: 12px;
border-top: 2px solid #ffffff;
border-right: 2px solid #ffffff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
	transition: all 0.8s ease;
}
.arrow1:hover::before{
left: 140px;
width: 14px;
height: 2px;
background: #ffffff;
	transition: all 0.8s ease;
}
.arrow1:hover::after{
left: 140px;
width: 12px;
height: 12px;
border-top: 2px solid #ffffff;
border-right: 2px solid #ffffff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
	transition: all 0.8s ease;
}

}

/*form*/
.searchform {
    display: inline-block;
    text-align: left;
}
.searchtable {
    border-collapse: collapse;
    font-size: 15px;
    line-height: 25px;
    border: none !important;
}
.searchtable, tr, td, th {
    border: 1px solid #cfcfcf;
    padding: 5px 10px 5px 10px;
}
.searchbox {
    font-size: 15px;
    padding: 5px;
    border: 1px solid #DDD;
    border-radius: 5px;
    width: 80%;
}
form input {
    vertical-align: middle;
}

.thisinfotable td, th {
    font-size: 12px;
    line-height: 20px;
}
.thisinfotable td, th {
    border: 1px solid #cfcfcf;
    font-size: 15px;
    line-height: 20px;
}
.searchtable .searchtabletitle {
    background-color: #78BADC;
    min-width: 120px;
}
.searchtable .searchbutton {
    background-color: #78BADC;
    border: none;
    color: white;
    padding: 10px 50px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    line-height: 15px;
    margin-top: 10px;
}
.searchtable .searchcenter {
    text-align: center;
}
.objecttable tr, td {
    border: none;
}

.searchordercontainer dd{
    display: inline-block;
    margin-left: 20px;
    margin-top:0px;
    line-height: 20px;
}
.searchordercontainer a{
    text-decoration: none;
}
.objecttable{
    border:2px solid #ccc;
    text-align:center;
    margin: auto auto 50px auto;
    width: 95%;
}
.objecttable tr, td{
    border:none;
}
.objecttitle{
    font-size:24px;
    font-weight:bold;
    text-align: center;
    width: 95%;
    margin: 0 auto;
    background-color: #5cbcf9;
    border: 1px solid #cfcfcf;
    color: #fff;
}
.objectimg p{
    text-align: center;
}
.objectmaintext {
    font-size:20px;
    font-weight: bold;
}
.thisinfotable {
    width: 100%;
    text-align: center;
    border-collapse: collapse;
}
.thisinfotable td,th {
    border: 1px solid #cfcfcf;
    font-size: 15px;
    line-height: 20px;
}

.oflBtn{
    width: 65%;
    margin: 0 auto;
}

.fontsizenormal {
    font-size:16px;
}
@media screen and (max-width: 575px) {
    .fontsizenormal {
        font-size:0.8em;
    }
}

.searchordercontainer dd{
    display: inline-block;
    margin-left: 20px;
    margin-top:0px;
    line-height: 20px;
}
.searchordercontainer a{
    text-decoration: none;
}
.shere_btn{
	width:50%;
}
.fcB{
	color:#222222;
	font-weight:bold;
}
.gaiyo{
	color:#3f3f3f;
	margin-top: 20px;
    text-align: center;
    font-size: 0.8rem;
}

h4{
	background-color: #062887;
    text-align: center;
    font-size: 1.6rem;
    color: #fff;
    padding: 5px;
}

.gaiyo_ul li{
	list-style: none;
}
.gaiyo_ul{
	padding: 5px;

}

.gaiyo_c{

	border: solid 1px #062887;
}
