martes, 17 de julio de 2018
@font-face {
font-family: 'arrows';
src:url('../fonts/arrows/arrows.eot');
src:url('../fonts/arrows/arrows.eot?#iefix') format('embedded-opentype'),
url('../fonts/arrows/arrows.woff') format('woff'),
url('../fonts/arrows/arrows.ttf') format('truetype'),
url('../fonts/arrows/arrows.svg#arrows') format('svg');
font-weight: normal;
font-style: normal;
}
.pc .story_frame{
width:960px;
height:800px;
}
.sphone .story_frame{
width:960px;
height:1000px;
}
.bb-custom-wrapper {
position: relative;
margin: 0 auto 40px;
margin: 0 auto;
text-align: center;
}
.bb-custom-wrapper h3 {
font-size: 1.4em;
font-weight: 300;
margin: 0.4em 0 1em;
}
.bb-custom-wrapper nav {
width: 100%;
height: 30px;
margin: 1em auto 0;
position: relative;
z-index: 0;
text-align: center;
}
.bb-custom-wrapper nav a {
display: inline-block;
width: 50px;
height: 50px;
text-align: center;
color: none;
}
.bb-custom-wrapper nav a:hover {
opacity: 0.6;
}
.bb-custom-icon-first:before,
.bb-custom-icon-last:before {
content: "\e002";
}
.bb-custom-icon-arrow-left:before,
.bb-custom-icon-first:before {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.bb-item2{
background-image:none;
}
iframe{
width:960px;
height:800px;
height:600px;
}
.iframeWrapper {
position: relative;
padding-bottom:74%;
height: 0;
}
.iframeWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
}
#layer {
display: none; /* åˆæœŸè¡¨ç¤ºã¯éžè¡¨ç¤º */
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
background-color: black;
opacity: 0.20;
}
/*-------------------------------------------------------------------
ãƒãƒƒãƒ—アップ
-------------------------------------------------------------------*/
#pt1{
text-align:center;
cursor: pointer;
}
.sphone #pt1{
margin-top:10%;
}
#pt1 img{
width:573px;
padding-left:40px;
}
.sphone #pt1 img{
width:700px;
}
.window {
z-index: 200;
position: fixed;
display: none;
top:0%;
left:0%;
background-color: #ffffff;
height:430px;
width:620px;
padding:30px;
margin-top:-250px;
margin-left:-330px;
box-shadow: 1px 1px 10px rgba(0,0,0,0.4);
-moz-box-shadow: 1px 1px 10px rgba(0,0,0,0.4);/* Firefox */
-webkit-box-shadow: 1px 1px 10px rgba(0,0,0,0.4);/* Safari,Google Chrome */
border-radius: 5px; /* CSS3 */
-moz-border-radius: 5px; /* Firefox */
-webkit-border-radius: 5px; /* Safari,Google Chrome */
}
.sphone .window {
height:650px;
width:85%;
margin-top:-35%;
margin-left:-45%;
}
.window .window_header{
font-size:20px;
font-weight:bold;
margin-bottom:13px;
}
.sphone .window .window_header{
font-size:30px;
}
.window .close {
width:75px;
padding:6px 15px 6px 15px;
color:#ffffff;
background: #f485a1;
float:right;
font-size:17px;
}
.sphone .window .close {
width:100px;
padding:6px 15px 6px 15px;
font-size:25px;
}
.window .close:hover {
background:#eb5278;
}
.window .window_foot a{
color:#f485a1;
font-size:15px;
text-decoration: none;
}
.sphone .window .window_foot a{
font-size:30px;
}
#modal {
z-index: 117;
background: #333;
opacity: 0.6;
display: none;
width: 100%;
height: 100%;
position: fixed;
top: 0px;
left:0px;
}
.sphone #modal {
z-index: 117;
background: #333;
opacity: 0.6;
display: none;
width: 100%;
height: 100%;
position: fixed;
top: 0px;
left:0px;
}
/*-------------------------------------------------------------------
レスãƒãƒ³ã‚·ãƒ–
-------------------------------------------------------------------*/
@media screen and (min-width: 700px) {
iframe{
width:100%;
height:800px;
}
.window iframe{
width:619px;
height:348px;
margin-bottom:10px;
}
.sphone .window iframe{
width:100%;
height:480px;
margin-bottom:10px;
}
}
/*-------------------------------------------------------------------
IE対応
-------------------------------------------------------------------*/
@media all and (-ms-high-contrast:none) and (max-width: 700px) {
.pc .footer_menu{
margin-bottom:500px;
}
#pt1 img{
width:320px;
}
}
/*------------------------------------------------------------------
Safari対応
-------------------------------------------------------------------*/
_::-webkit-full-page-media, _:future, :root .sphone .window .close {
width:120px;
}
_::-webkit-full-page-media, _:future, :root .sphone #modal {
z-index: 117;
background: #333;
opacity: 0.6;
display: none;
width: 100%;
height: 100%;
position: fixed;
top: 0px;
left:0px;
}
Suscribirse a:
Entradas (Atom)