* {
    margin:0;
    padding:0;
    word-wrap:break-word;
    overflow-wrap:break-word;
    box-sizing:border-box;
}
body {
	line-height:1.4em;
	letter-spacing:0.2px;
	font-size:16px;
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka;
	background:#FFF;
    color:#333;
}
h1 {
    clear:both;
    margin:0 0 2.5%;
    padding:4% 0 0;
    text-align:center;
    font-size:26px;
    color:#314E7D;
}
h2 {
    clear:both;
    margin:2% 0 0.5%;
    font-size:20px;
    color:#1F5391;
}
h3 {
    clear:both;
    margin:0 0 0.2%;
    font-size:18px;
    font-weight:normal;
    color:#1F5391;
}
h4 {
    clear:both;
    margin:0 0 2%;
    text-align:center;
    font-size:22px;
    color:#1F5391;
}
ol {
    float:left;
    width:100%;
    font-size:18px;
}
ol li {
    float:left;
    margin:0 0 0 1em;
    width:100%;
    line-height:1.4em;
    list-style-position:inside;
}
ol li:last-child {
    margin:0 0 3% 1em;
}
ul {
    margin:0 auto;
    width:100%;
    list-style:none;
}
ul li {
    float:left;
}
p {
    margin:0 0 1%;
}
img {
    border:none;
    width:100%;
}
iframe {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
a {
    text-decoration:none;
    color:#333;
}
a:hover {
    color:#888;
}
a:hover img {
    opacity:0.8;
}
.point {
    font-weight:bolder;
    color:#6581CA;
}
.fl {
    display:block;
    margin:0.8% 0 0;
    font-size:18px;
    font-weight:normal;
    color:#333;
}

#container {
    z-index:0;
    position:relative;
    margin:0 auto;
    width:1200px;
}

#topbanner {
    margin:0 0 2.5%;
    height:480px;
    background:url("img/topbanner-pc.png") top no-repeat;
}

#toptext {
    margin:0 auto 2.5%;
    background:url(img/motorola-logo.png) left no-repeat;
    background-size:290px auto;
}
#toptext p {
    margin:0 0 0 325px;
}

#point li {
    margin:0 0 4%;
    width:100%;
}
#point li:last-child {
    margin:0 0 2%;
}

#mbox1 {
    position:relative;
    padding:0 0 56.25%;
    width:100%;
    height:100%;
}

.resize1 {
    margin:0 10% 1%;
    width:80%;
}

#imgbox1 {
    z-index:1;
    position:relative;
    margin:0.8% 0 0;
    height:560px;
    background:url("img/img02.jpg") no-repeat;
    background-position:top;
    background-size:100%;
}
.imgtext1 {
    float:right;
    z-index:2;
    position:relative;
    margin:240px 60px 0 0;
    width:40%;
    color:#FFF;
}

#cam1 {
    margin:3% 0 0;
}
#cam1 li {
    margin:0 3.5% 3% 0;
    width:31%;
}
#cam1 li:nth-child(3n) {
    margin:0 0 3%;
}
#cam1 li:last-child {
    margin:0 0 5%;
}
#cam1 img {
    display:block;
    margin:1.5% 0 2%;
}

#cam2 {
    margin:0.5% 0 0;
}
#cam2 li {
    margin:0 4% 3% 0;
    width:48%;
}
#cam2 li:nth-child(2n) {
    margin:0 0 3%;
}
#cam2 li:last-child {
    margin:0 0 4%;
}
#cam2 p {
    margin:0.5% 0 1.5%;
}

#mbox2 {
    position:relative;
    padding:0 0 75%;
    width:100%;
    height:100%;
}
#mbox2 iframe {
    border-radius:13px;
}

.resize2 {
    margin:0.5% 8.5% 1%;
    width:83%;
}

#imgbox2 {
    z-index:1;
    position:relative;
    margin:0.8% 0 0;
    height:560px;
    background:url("img/img12.png") top no-repeat;
    background-size:100%;
}
.imgtext2{
    float:right;
    z-index:2;
    position:relative;
    margin:220px 60px 0 0;
    width:40%;
    color:#FFF;
}

.function {
    float:left;
    margin:0 2% 0 0;
    width:43%;
    height:360px;
    background:url("img/img13.png") center no-repeat;
    background-size:cover;
}

#shortcut {
    float:right;
    margin:0 auto 3%;
    width:55%;
}
#line1 div {
    float:left;
    padding:0.5em 0 0.4em;
    width:38%;
    text-align: center;
    border-right:#FFF 1px solid;
    background:#1F5391;
    color:#FFF;
}
#line1 div:nth-child(2n) {
    border:none;
    width:62%;
}
#line2 {
    clear:both;
}
#line2 div {
    float:left;
    padding:0.5em 1.5em 0.4em;
    width:38%;
    border-top:#1F5391 1px solid;
    border-left:#1F5391 1px solid;
}
#line2 div:nth-child(2n) {
    width:62%;
    border-right:#1F5391 1px solid;
}
.end div {
    margin:0 0 0.8%;
    border-bottom:#1F5391 1px solid;
}
.caution {
    clear:both;
    font-size:14px;
    color:#F00;
}

#link {
    clear:both;
    padding:3% 0 0;
}
#link li {
    margin:0 0 4%;
    width:50%;
    text-align:center;
    font-size:18px;
    color:#1F5391;
}
#link li:first-child {
    margin:0 0 4%;
    width:100%;
    color:#2A4361;
}
#link li:first-child p {
    margin:0 auto;
    width:39em;
    line-height:1.4em;
}
#link li:first-child img {
    width:40%;
}
#link img {
    width:64%;
}

#foot {
    clear:both;
    margin:0 auto 2%;
    text-align:center;
}

@media screen and (max-width:480px) {

h1 {
    margin:0 0 5%;
    padding:10% 0 0;
    text-align:left;
    font-size:18px;
}
h2 {
    margin:0 0 1%;
    font-size:16px;
}
h3 {
    margin:0 0 1%;
    font-size:16px;
}
h4 {
    margin:0 0 6%;
    font-size:18px;
}
ol {
    float:none;
    margin:0;
    width:100%;
    font-size:16px
}
ol li {
    float:none;
    margin:0 0 2%;
    padding:0 0.5em;
    width:100%;
}
ol li:last-child {
    margin:0 0 6%;
}

ul li {
    float:none;
}
img {
    max-width:100%;
}
.fl {
    font-size:16px;
}

#container {
    width:94%;
}

#topbanner {
    margin:0;
    padding:0 0 100%;
    height:auto;
    background:url("img/topbanner-sp.png") top no-repeat;
    background-size:100%;
}

#toptext {
    background:url("img/motorola-logo.png") top no-repeat;
    background-size:70%;
}
#toptext p {
    margin:0 0 3%;
    padding:21% 0 0;
    width:100%;
}

#point li {
    margin:0 0 8%;
}
#point li:last-child {
    margin:0 0 5%;
}
#point p {
    margin:0 0 2%;
}
.resize1 {
    margin:0 2%;
    width:96%;
}

#imgbox1 {
    margin:0;
    padding:0 0 82%;
    height:auto;
    background-position:bottom 0 left 0;
    background-size:cover;
}
.imgtext1 {
    float:none;
    margin:0 0 2%;
    width:100%;
    color:#333;
}

#cam1 {
    margin:0;
}
#cam1 li {
    margin:0 0 6.5%;
    padding:0;
    width:100%;
}
#cam1 li:nth-child(3n) {
    margin:0 0 6.5%;
}
#cam1 li:last-child {
    margin:0 0 9%;
}
#cam1 p {
    margin:1% 0 1.5%;
}
#cam1 img {
    display:block;
    margin:1.5% 0 2%;
}

#cam2 {
    margin:0;
}
#cam2 li {
    margin:0 0 7%;
    width:100%;
}
#cam2 li:nth-child(2n) {
    margin:0 0 7%;
}
#cam2 li:last-child {
    margin:0 0 6%;
}
#cam2 p {
    margin:0 0 2%;
}

#mbox2 iframe {
    border-radius:0.4em;
}

.resize2 {
    margin:0 auto;
    width:100%;
}

#imgbox2 {
    margin:0;
    padding:0 0 80%;
    height:auto;
    background-position:bottom 0 left 0;
    background-size:cover;
}
.imgtext2 {
    float:none;
    margin:0 0 2%;
    width:100%;
    color:#333;
}

.function {
    float:none;
    margin:0 0 4%;
    padding:0 0 80%;
    width:100%;
    height:auto;
    background:url("img/img13.png") center no-repeat;
    background-size:cover;
}

#shortcut {
    float:none;
    margin:0 auto 3%;
    width:100%;
    line-height:1.4em;
    font-size:14px;
}
#line1 div {
    padding:0.7em 1em 0;
    width:38%;
    height:4em;
}
#line1 div:nth-child(2n) {
    padding:1.4em 1em 0;
    width:62%;
}

#line2 div {
    padding:0.7em 1em 0;
    width:38%;
    height:4em;
}
#line2 div:nth-child(2n) {
    width:62%;
}
.end div {
    margin:0 0 1.5%;
}

#link {
    padding:5% 0 0;
}
#link li {
    margin:0 0 10%;
    width:100%;
    font-size:16px;
}
#link li p {
    margin:0 auto;
    width:92%;
}
#link li:first-child {
    margin:0 0 12%;
}
#link li:first-child p {
    margin:0 auto 2%;
    width:92%;
    line-height:1.25em;
}
#link li:first-child img {
    width:100%;
}
#link img {
    width:72%;
}

#foot {
    margin:0 auto 5%;
}
}