/* ios */
iphone-portrait{
	width:320px;
}
iphone-landscape{
	width:480px;
}
iphone5-landscape{
	width:568px;
}


/* spgrid  */
.container {
	margin:10px;
}
.container-full {
	margin:10px 0px;
}

.row,
.container .row{
	margin: 0 -10px ;
}
.container .box {
	margin: 10px;
	float:left;
	overflow:auto;
}
.container .box-nofloat {
	margin: 10px;
	overflow:auto;
}

.sep2{
	width:50%;
}

.sep3{
	width:33.3333333%;
}

.sep4{
	width:25%;
}

.sep5{
	width:20%;
}

.sep6{
	width:16.6666666%;
}

.sep7{
	width:14.28%;
}

.sep8{
	width:12.5%;
}

.sep9{
	width:11.1%;
}

.sep10{
	width:10%;
}

.sep16{
	width:6.25%;
}

dl[class^="sep"],
dl[class*=" sep"],
ol.sep1,
ol.sep2,
ol.sep3,
ol.sep4,
ol.sep5,
ol.sep6,
ol.sep7,
ol.sep8,
ol.sep9,
ol.sep10,
ol.sep16,
ul.sep1,
ul.sep2,
ul.sep3,
ul.sep4,
ul.sep5,
ul.sep6,
ul.sep7,
ul.sep8,
ul.sep9,
ul.sep10,
ul.sep16{
	width:auto;
}
*.sep2 > *{
	width:50%;
}
*.sep3 > *{
	width:33.33%;
}
*.sep3 > *.col2{
	width:67%;
}
*.sep4 > *.col1,
*.sep4 > *{
	width:25%;
}
*.sep4 > *.col2{
	width:50%;
}
*.sep4 > *.col3{
	width:75%;
}
*.sep4 > *.col4{
	width:100%;
}

*.sep5 > *.col1,
*.sep5 > *{
	width:20%;
}
*.sep5 > *.col2{
	width:40%;
}
*.sep5 > *.col3{
	width:60%;
}
*.sep5 > *.col4{
	width:80%;
}
*.sep5 > *.col5{
	width:100%;
}
*.sep6 > *{
	width:16.6666666%;
}
*.sep7 > *{
	width:14.28%;
}
*.sep8 > *{
	width:12.5%;
}
*.sep9 > *{
	width:11.1%;
}
*.sep10 > *{
	width:10%;
}
*.sep16 > *{
	width:6.25%;
}


/*column 10col margin 10px*/
.default-margin{
	margin:10px;
}
.grid300{
}
.grid300 .col10{
	width:300px;
}
.grid300 .col9{
	width:278px;
}
.grid300 .col8{
	width:246px;
}
.grid300 .col7{
	width:214px;
}
.grid300 .col6{
	width:182px;
}
.grid300 .col5{
	width:150px;
}
.grid300 .col4{
	width:118px;
}
.grid300 .col3{
	width:85px;
}
.grid300 .col2{
	width:53px;
}
.grid300 .col1{
	width:21px;
}


/* app icon */
.app-icon{
	width:44px;
	height:44px;
}

.app-icon-radian{
-webkit-border-radius: 2px;
border-radius: 2px;
}

/* ul splitlist */
ul.splitlist {
zoom: 1;
}
ul.splitlist:after{
  content: ""; 
  display: block; 
  clear: both;
}
ul.splitlist > li {
float:left;
display:block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
overflow:hidden;
}

.splitlist .split-left{
	border-left: 1px solid #bbb;
}
.splitlist .split-right{
	border-right: 1px solid #bbb;
}


/* ul seplist  */
ul.seplist {
zoom: 1;
}
ul.seplist:after{
  content: ""; 
}
ul.seplist > li {
display: inline-block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
overflow:hidden;
}
ul.seplist > li > a {
display: inline-block;
}

ul.seplist > li:before {
 content: " | ";
}
ul.seplist > li:first-child:before {
 content: "";
}


/* ul navilist */
ul.navilist {
zoom: 1;
}
ul.navilist:after{
  content: ""; 
  display: block; 
  clear: both;
}
ul.navilist > li {
float:left;
display:block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
overflow:hidden;
}

ul.navilist > li > a{
display:block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
overflow:hidden;
text-align:center;
text-decoration:none;
padding: 0.5em;
line-height:1.3;
word-wrap: normal;
word-break:keep-all;
}

/* .navilist g */
ul.navilist > li {
background-color: #777;
color: #fff;
border-left: 1px solid #fff;
}
ul.navilist > li:first-child {
border-left:none;
}
ul.navilist > li > a{
background-color: #666;
color: #fff;
}
ul.navilist > li > a:hover{
background-color: #999;
color: yellow;
}
ul.navilist > li > a.active{
background-color: #999;
color: #fff;
}
ul.navilist > li:first-child {
border-left:none;
}



/*button*/
a.button{
-webkit-border-radius: 2px;
border-radius: 2px;
}
a.button:hover{
	background: white;
}

/* navibar */
.navibar{
height: 22px;
display:block;
overflow:hidden;
padding: 11px 10px;
margin-bottom:2px;
}
.navibar > *{
height:22px;
}

/* navibar g */
.navibar {
background: gradient(linear, left top, left bottom, from(white), to(gray)); 
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#cfcfcf)); 
box-shadow: 1px 0px 1px 1px rgba(0,0,0,0.4);
}


/* ul listview */
ul.listview {
 border-bottom: 1px solid #ccc;
}
ul.listview  > li{
 background: linear-gradient(#fff, #f0f0f0);
 background-image: gradient(linear, left top, left bottom, from(#fff), to(#f0f0f0));
 background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f0f0f0));
 border-top: 1px solid #ccc;
 margin: 0px;
position:relative;
}
ul.listview  > li > a{
 color: #666;
 display: block;
 margin: 0;
 padding: 10px 20px 10px 10px;
 overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
 text-decoration: none;
 line-height: 1.2;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
ul.listview  > li > a p{
white-space: normal;
}

ul.listview  > li a.no-arrow{
padding:10px;
}
ul.listview  > li a.no-arrow::after{
 background: none;
}

ul.listview  > li a::after{
content: '';
display: block;
position: absolute;
top: 50%;
line-height: 1;
right: 10px;
font-weight: bold;
}
ul.listview  > li a::after{
background: url(../img/arrow.png) no-repeat 0% 0%;
width: 9px;
height: 10px;
margin-top: -6.5px;
}
ul.listview  > li a.arrow2::after{
 background: url(../img/arrow2.png) no-repeat 0% 0%;
width: 16px;
height: 16px;
margin-top: -8px;
}

i.arrow,
i.arrow2{
    display:inline-block;
    height: 1.2em;
    width:1.2em;
    background-size:cover;
    vertical-align: middle;
}
i.arrow{
    background: url(../img/arrow.png) no-repeat center center;
}
i.arrow2{
    background: url(../img/arrow2.png) no-repeat center center;
}


ul.listview  > li a.one-line{
 padding-left: 5px;
 padding-top: 27px;
}
ul.listview  > li a:after{
 content:"";
 display:block;
 clear:left;
}
ul.listview  > li a span.txt{
 float:left;
 display: block;
 line-height: 1.2;
 margin-top: 27px;
 margin-left: 5px;
}
ul.listview  > li img{
 float: left;
 height: 60px;
 width: 60px;
 }
ul.listview  > li a strong.txt{
 color: #000;
 display: block;
 font-weight: bold;
 margin-left: 5px;
 line-height: 1.2;
}


/* dl tablelist 2column */
* html body dl.tablelist dd div{
   display:inline-block;
}

dl.tablelist dt {
   float:left;
   width:5em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

dl.tablelist dd {
   margin-left:0;
   padding-left:5em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

/* splitnavi */
.splitnavi{
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.splitnavi > li{
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    position:relative;
}
.splitnavi > li  a{
    display:block;
    height:3em;
    padding: 0.5em;
    line-height: 1.5em;
}

.splitnavi > li  a.arrow {
	padding-right: 35px;
}
.splitnavi > li  a.arrow::after {
	content:"";
	background: url(../img/arrow.png) no-repeat 0% 0%;
	display:block;
	position:absolute;
	top:50%;
	right: 10px;
	margin-top:-4px;
	height: 12px;
	width:8px;
}

.splitnavi i.banner{
	display:inline-block;
	float:left;
	margin:0px 10px 0px 0;
}


/* icon */

i.banner{
	background-image: url(//www.rasysa.com/pkg/style/image/detail/logo_rasysa.gif);
	display: block;
	height: 70px;
	width: 70px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
i.banner-size-iconthumb {
	height: 70px;
	width: 140px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
i.banner-size-amebalarge {
	height: 100%;
	width: 106px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
i.banner-size-appicon {
	height: 44px;
	width: 44px;
}
i.banner-size-appicon60 {
	height: 60px;
	width: 60px;
}
i.banner-size-appiconlarge {
	height: 70px;
	width: 94px;
}
i.banner-size-appicon-x-small {
	height: 30px;
	width: 30px;
}
i.banner-image-contain {
	background-size:contain;
}
i.banner-border-on {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #cccccc;
}

.listview i.banner{
	display:inline-block;
	float:left;
	margin-right: 10px;
}

ul.listview.flat > li{
background-image:none;;
}
ul.listview.flat > li{
border-top:none;
border-bottom: 1px solid #ccc;
}
ul.listview.flat > li:last-child{
border-top:none;
border-bottom: none;
}




/* design */

.flat-gradation{
 background-color: #f5f5f5;
  *background-color: #e6e6e6;
  background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
  background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  background-repeat: repeat-x;
  border-top: 1px solid #bbbbbb;
  border-bottom: 1px solid #bbbbbb;
  *border: 0;
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  border-bottom-color: #a2a2a2;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  *zoom: 1;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}


/* */
.visible-phone {
  display: none !important;
}

.visible-tablet {
  display: none !important;
}

.hidden-desktop {
  display: none !important;
}

.visible-desktop {
  display: inherit !important;
}

@media (min-width: 768px) and (max-width: 979px) {
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important ;
  }
  .visible-tablet {
    display: inherit !important;
  }
  .hidden-tablet {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important;
  }
  .visible-phone {
    display: inherit !important;
  }
  .hidden-phone {
    display: none !important;
  }
}


/* box */
.liquid-wrap {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    display: -o-box;
    display: box;
}
.liquid-flex {
    -webkit-box-flex: 1.0;
    -moz-box-flex: 1.0;
    -ms-box-flex: 1.0;
    -o-box-flex: 1.0;
    box-flex: 1.0;
}