/* クリック時に枠を消す */
a {outline:none;}
img {outline:none;}
button {outline:none;}

/* 小さい画面に表示 */
@media screen and (min-width: 490px){
.bigEntrance{display:none;}}
@media screen and (min-width: 490px){
.masamune{display:none;}}
@media screen and (min-width: 490px){
.ryokin{display:none;}}

@media screen and (min-width: 490px){
.serifu{display:none;}}
@media screen and (min-width: 490px){
.miuraintelligence{display:none;}}
@media screen and (min-width: 490px){
.syoukai{display:none;}}
@media screen and (min-width: 490px){
.table{display:none;}}
@media screen and (min-width: 490px){
.gas{display:none;}}
@media screen and (min-width: 490px){
.tnk{display:none;}}
@media screen and (min-width: 490px){
.reform{display:none;}}
@media screen and (min-width: 490px){
.twitter{display:none;}}
@media screen and (min-width: 490px){
#.twitter-timeline{display:none;}}
@media screen and (min-width: 490px){
.button{display:none;}}
@media screen and (min-width: 490px){
.add{display:none;}}
@media screen and (min-width: 490px){
.igune{display:none;}}
@media screen and (min-width: 490px){
.line00{display:none;}}
@media screen and (min-width: 490px){
.line01{display:none;}}
@media screen and (min-width: 490px){
.line02{display:none;}}
@media screen and (min-width: 490px){
.line03{display:none;}}

@media screen and (min-width: 740px){
.portrait{display:none;}}
/* 大きい画面に表示 */
@media screen and (max-width: 720px){
div.pconly{display:none;}}
@media screen and (max-width: 580px){
div.portrait{display:none;}}

/* 杜の都仙台のみなさまへ */
.portrait{
      width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
}
.pconly{
      width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
}
div.pconly{
      width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
}
/* 大きい画面ここまで */

/* 背景色 */
body {
background-color: #ffffcc;
}
/* 杜の都仙台のみなさまへ */
.morinomiyako{
      width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
}

/* まんがtitleバ～～～ン */

.bigEntrance{
        text-align: center;
	animation-name: bigEntrance;
	-webkit-animation-name: bigEntrance;	

	animation-duration: 1.6s;	
	-webkit-animation-duration: 1.6s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	visibility: visible !important;	
        margin-top: -10px; 		
}

@keyframes bigEntrance {
	0% {
		transform: scale(0.3) rotate(-50deg) translateX(-30%) translateY(30%);
		opacity: 0.2;
	}
	30% {
		transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);		
		opacity: 1;
	}
	45% {
		transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	60% {
		transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	85% {
		transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	95% {
		transform: scale(1.11) rotate(0deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	100% {
		transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
		opacity: 1;
	}		
}

@-webkit-keyframes bigEntrance {
	0% {
		-webkit-transform: scale(0.3) rotate(-50deg) translateX(-30%) translateY(30%);
		opacity: 0.2;
	}
	30% {
		-webkit-transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);		
		opacity: 1;
	}
	45% {
		-webkit-transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	60% {
		-webkit-transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	85% {
		-webkit-transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	95% {
		-webkit-transform: scale(1.11) rotate(0deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	100% {
		-webkit-transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
		opacity: 1;
	}				
}

/* 今だけお試し0円！ */
.masamune{
      width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
           margin-top: -10px; 
}
/* 下からバ～～～ン */

.ryokin{
        text-align: center;
	animation-name: hatch;
	-webkit-animation-name: hatch;	

	animation-duration: 4s;	
	-webkit-animation-duration: 4s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;

	transform-origin: 50% 100%;
	-ms-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%; 

	visibility: visible !important;		
}

@keyframes hatch {
	0% {
		transform: rotate(0deg) scaleY(0.6);
	}
	20% {
		transform: rotate(-3deg) scaleY(1.05);
	}
	35% {
		transform: rotate(3deg) scaleY(1);
	}
	50% {
		transform: rotate(-3deg);
	}	
	65% {
		transform: rotate(1deg);
	}	
	80% {
		transform: rotate(-1deg);
	}		
	100% {
		transform: rotate(0deg);
	}									
}

@-webkit-keyframes hatch {
	0% {
		-webkit-transform: rotate(0deg) scaleY(0.6);
	}
	20% {
		-webkit-transform: rotate(-3deg) scaleY(1.05);
	}
	35% {
		-webkit-transform: rotate(3deg) scaleY(1);
	}
	50% {
		-webkit-transform: rotate(-3deg);
	}	
	65% {
		-webkit-transform: rotate(1deg);
	}	
	80% {
		-webkit-transform: rotate(-1deg);
	}		
	100% {
		-webkit-transform: rotate(0deg);
	}		
}

.miuraintelligence{width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
}

.button{width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
           outline:none;
}

div.button:active {position: relative;
	             top: 3px;
                     outline:none;
}

.add { color: #336600; 
                font-size: 16px;
                width:100%;
                height: auto;
                
                text-align:center; }
.serifu{width: 100%;
           height: 100%;
           margin: 0 auto;
           text-align:center;

}

.syoukai { color: #ffffff; 
                font-size: 12px;
                width:100%;
                height: auto;
                background-color: #3300ff;
                text-align:center; }

.gas { color: #000000; 
                font-size: 12px;
                width:100%;
                height: auto;
                background-color: #e0ffff;
                text-align:left;
                
 }

.tnk { color: #000000; 
                font-size: 12px;
                width:100%;
                height: auto;
                background-color: #e0ffff;
                text-align:left; 
              
}

.reform { color: #000000; 
                font-size: 12px;
                width:100%;
                height: auto;
                background-color: #e0ffff;
                text-align:left; 
}
/*いぐね */
.igune{
      width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
           margin-top: -5px; 
}

/*ラインスタンプ */
.linetable{
      width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
           margin-top: 0px; 
}
.line00{
      width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
           margin-top: 5px; 
}

.line01{
           color: #000000; 
           font-size: 8px;
           width: 100;
           height: auto;
           margin: 0 auto;
           text-align:center;
           margin-top: 0px; 
}
.line02{
           color: #000000; 
           font-size: 8px;
           width: 100;
           height: auto;
           margin: 0 auto;
           text-align:center;
           margin-top: 0px; 
}
.line03{
           color: #000000; 
           font-size: 8px;
           width: 100;
           height: auto;
           margin: 0 auto;
           text-align:center;
           margin-top: 0px; 
}
/* twitter */
.twitter{
      width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;
           margin-top: 10px;
}
/* カウンター */
.counter{width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;

}

/* コピーライト */
.copy{width: 100%;
           height: auto;
           margin: 0 auto;
           text-align:center;

}

/* ここから自己紹介 */

.waku {
   padding: 10px;
}

.bg03 {
  background-image: 
url(img/left_top03.png),
url(img/right_top03.png), 
url(img/left_bottom03.png), 
url(img/right_bottom03.png), 
url(img/top03.png), 
url(img/bottom03.png), 
url(img/left03.png), 
url(img/right03.png);
  background-repeat: 
no-repeat, 
no-repeat,
no-repeat, 
no-repeat, 
repeat-x, 
repeat-x, 
repeat-y, 
repeat-y;
  background-position: left top, right top, left bottom, right bottom, top, bottom, left, right;
  background-color: #ccffff;
  -webkit-box-sizing : border-box;
  -moz-box-sizing : border-box;
  box-sizing : border-box;
  padding: 20px;
}
.bg03 p {
  color: #020241;
  font-size: 12px;
  line-height: 160%;
  text-align: center;
}
.txt_right {
  text-align: right;
}

.copy {
  text-align: center;
}
/* ここまで自己紹介 */

