html,body{ margin: 0; padding: 0; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; text-size-adjust: 100%;}
body{ margin:0 auto; padding:0;}

/* IE8+, Chrome */
a{ outline: 0;}

/* root */
:root {
    --darkgray: #35363b;
    --lightgray: #eeeeee;
    --bordergray: #adadad;
    --red: #cc0000;
    
    --comp-200: 27.027027027027vw;
    --comp-195: 26.3513513513513vw;
    --comp-190: 25.6756756756756vw;
    --comp-185: 25vw;
    --comp-180: 24.3243243243243vw;
    --comp-175: 23.6486486486486vw;
    --comp-170: 22.9729729729729vw;
    --comp-165: 22.2972972972972vw;
    --comp-160: 21.6216216216216vw;
    --comp-155: 20.9459459459459vw;
    --comp-150: 20.2702702702702vw;
    --comp-145: 19.5945945945945vw;
    --comp-140: 18.9189189189189vw;
    --comp-135: 18.2432432432432vw;
    --comp-130: 17.5675675675675vw;
    --comp-125: 16.8918918918918vw;
    --comp-120: 16.2162162162162vw;
    --comp-115: 15.5405405405405vw;
    --comp-110: 14.8648648648648vw;
    --comp-105: 14.1891891891891vw;
    --comp-100: 13.5135135135135vw;
    --comp-95: 12.83783783783783vw;
    --comp-90: 12.1621621621621vw;
    --comp-85: 11.48648648648648vw;
    --comp-80: 10.8108108108108vw;
    --comp-75: 10.13513513513513vw;
    --comp-70: 9.459459459459459vw;
    --comp-65: 8.738738738738738vw;
    --comp-60: 8.108108108108108vw;
    --comp-55: 7.432432432432432vw;
    --comp-50: 6.756756756756756vw;
    --comp-45: 6.081081081081081vw;
    --comp-40: 5.405405405405405vw;
    --comp-35: 4.729729729729729vw;
    --comp-30: 4.054054054054054vw;
    --comp-25: 3.378378378378378vw;
    --comp-20: 2.702702702702702vw;
    --comp-15: 2.027027027027027vw;
    --comp-10: 1.351351351351351vw;
    --comp-5: 0.6756756756756756vw;
    
    --comp-68: 9.189189189189189vw;
    --comp-36: 4.864864864864864vw;
    --comp-32: 4.324324324324324vw;
    --comp-28: 3.783783783783783vw;
    --comp-27: 3.648648648648648vw;
    --comp-26: 3.513513513513513vw;
    --comp-24: 3.243243243243243vw;
    --comp-22: 2.972972972972972vw;
    --comp-18: 2.432432432432432vw;
    --comp-16: 2.162162162162162vw;
    --comp-12: 1.621621621621621vw;
}

/* Firefox */
a::-moz-focus-inner,
a::-moz-focus-inner { border: 0;}
    

/*----------------------------------------------

COMMON

----------------------------------------------*/
/*-- container --*/
#googlebuilt-in-container{ overflow: hidden; width: 100%; position: relative;}
#googlebuilt-in-content{ display: block; width: 100%;  background: var(--lightgray);}
#googlebuilt-in-content.top{ padding: min(var(--comp-80),120px) 0;}

/*-- navi --*/
/*hamburger*/
#googlebuilt-in-hamburger{ width: min(var(--comp-100), 60px); height: min(var(--comp-100), 60px); position: absolute; top: 20px; right: 40px; background: var(--darkgray); z-index: 100;}
#googlebuilt-in-hamburger.fixed{ position: fixed; top: 20px; right: 40px;}
#googlebuilt-in-hamburger span{ width: min(var(--comp-55), 34px); height: 1px; position: absolute; top: 50%; left: 50%; background: #fff; display: block; transform: translateX(-50%); transition: transform 0.4s ease, opacity 0.4s ease}
#googlebuilt-in-hamburger span:nth-child(1){ transform: translateX(-50%) translateY(max(calc(var(--comp-25) * (-1)), -11px));}
#googlebuilt-in-hamburger span:nth-child(2){ transform: translateX(-50%); opacity: 1;}
#googlebuilt-in-hamburger span:nth-child(3){ transform: translateX(-50%) translateY(min(var(--comp-25), 11px));}
#googlebuilt-in-hamburger.active span:nth-child(1){ transform: translateX(-50%) translateY(0) rotate(225deg);}
#googlebuilt-in-hamburger.active span:nth-child(2){ transform: translateX(-50%) scale(0); opacity: 0;}
#googlebuilt-in-hamburger.active span:nth-child(3){ transform: translateX(-50%) translateY(0) rotate(135deg);}
    
/*navi content*/
#googlebuilt-in-navi{ width: 100%; max-width: 480px; position: absolute; top: 0; right: 0; background: var(--darkgray); z-index: 99; transform: translateX(101%); opacity: 0; transition: transform 0.4s ease, opacity 0.4s ease;}
#googlebuilt-in-navi.active{ transform: translateX(0); opacity: 1;}
#googlebuilt-in-navi.fixed{ position: fixed; top: 0; right: 0;}
#googlebuilt-in-navi .wrap-googlebuilt-in-navi{ width: 100%; height: calc(101vh + 65px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--red) #bbc2c9;}
#googlebuilt-in-navi .wrap-googlebuilt-in-navi::-webkit-scrollbar{ width: 8px; }
#googlebuilt-in-navi .wrap-googlebuilt-in-navi::-webkit-scrollbar-track{ background-color: #bbc2c9; }
#googlebuilt-in-navi .wrap-googlebuilt-in-navi::-webkit-scrollbar-thumb{ background-color: var(--red); }
#googlebuilt-in-navi .inner-googlebuilt-in-navi01{ background: #fff; padding: min(var(--comp-125), 100px) 0 min(var(--comp-20), 20px);}
#googlebuilt-in-navi .inner-googlebuilt-in-list01 > li a{ display: block; position: relative; transition: background 0.5s ease, color 0.5s ease;}
#googlebuilt-in-navi .inner-googlebuilt-in-list01 > li a::after{ content: ""; display: block; height: 1px; background: var(--bordergray); width: calc(100% - min(var(--comp-100), 110px)); position: absolute; bottom: 0; left: min(var(--comp-50), 55px); transition: background 0.5s ease;}
#googlebuilt-in-navi .inner-googlebuilt-in-list01 > li a span{ padding: min(var(--comp-35), 25px) min(var(--comp-50), 55px); display: block; font-weight: 400; font-size: min(var(--comp-26), 22px); line-height: 1.6;}
#googlebuilt-in-navi .inner-googlebuilt-in-list01 > li a:hover{ background: var(--darkgray); color: #fff;}
#googlebuilt-in-navi .inner-googlebuilt-in-list01 > li a:hover::after{ background: var(--darkgray); }
#googlebuilt-in-navi .inner-googlebuilt-in-list01 > li:last-child a::after{ content: none;}
#googlebuilt-in-navi .inner-googlebuilt-in-navi02{ background: var(--lightgray); padding: min(var(--comp-50), 40px) min(var(--comp-50), 55px)}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-01{ margin-bottom: min(var(--comp-50), 45px)}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-01 > li{ margin-bottom: min(var(--comp-30), 20px); font-size: min(var(--comp-24), 18px); display: flex; align-items: center;}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-01 > li span{ display: inline-block; width: min(var(--comp-50), 40px); flex-grow: 0; margin-right: min(var(--comp-10), 10px);}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-01 > li a{ transition: opacity 0.5s ease; display: inline-block; position: relative;}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-01 > li a:hover{ text-decoration: underline;}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-01 > li:last-child{ margin-bottom: 0;}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-02 > li{ margin-bottom: min(var(--comp-30), 20px); font-size: min(var(--comp-24), 18px)}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-02 > li a{ transition: opacity 0.5s ease; display: inline-block; position: relative;}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-02 > li a:hover{ text-decoration: underline;}
#googlebuilt-in-navi .inner-googlebuilt-in-list02-02 > li:last-child{ margin-bottom: 0;}
#googlebuilt-in-navi .inner-googlebuilt-in-navi03{ padding: min(var(--comp-25), 25px) min(var(--comp-50), 55px) calc(min(var(--comp-40), 50px) + 65px);}
#googlebuilt-in-navi .inner-googlebuilt-in-navi03 p{ display: block}
#googlebuilt-in-navi .inner-googlebuilt-in-navi03 p a{ display: flex; align-items: center; justify-content: flex-start; color: #fff;}
#googlebuilt-in-navi .inner-googlebuilt-in-navi03 p a:hover{ text-decoration: underline;}
#googlebuilt-in-navi .inner-googlebuilt-in-navi03 p a::before{ content: ""; width: min(var(--comp-24), 18px); height: min(var(--comp-24), 18px); display: block; margin-right: min(var(--comp-15), 10px); background: url("../img/common/icon-language-w.svg") no-repeat center center; background-size: 100% 100%; margin-top: 2px;}
#googlebuilt-in-navi .inner-googlebuilt-in-navi03 p span{ font-size: min(var(--comp-24), 18px); font-weight: 700; display: inline-block; line-height: 1.4;}

/*-- OTHER LINK --*/
#googlebuilt-in-other-link{ padding: min(var(--comp-120), 120px) min(var(--comp-70), 60px);}
#googlebuilt-in-other-link.gray{ background: var(--lightgray);}
#googlebuilt-in-other-link.white{ background: #fff;}

#googlebuilt-in-other-link .googlebuilt-in-other-link-list01{ gap: min(var(--comp-40), 60px); display: flex; justify-content: center; width: min(100%, 1080px); margin: 0 auto;}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list01:not(:last-child){ margin-bottom: min(var(--comp-60), 60px);}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list01 li{ width: calc(100% / 2); text-align: center; display: flex; align-items: center; justify-content: center;}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list01 li .flag{ display: inline-block; width: min(var(--comp-50), 40px); flex-grow: 0; margin-right: min(var(--comp-10), 10px);}
#googlebuilt-in-other-link.white .googlebuilt-in-other-link-list01 li .flag{ border: 1px solid var(--lightgray);}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list01 li{ width: calc(100% / 2); text-align: center;}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list01 li a{ display: inline-block; font-size: min(var(--comp-28), 18px); position: relative; padding-bottom: 3px; color: #000;}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list01 li a:hover{ text-decoration: underline;}

#googlebuilt-in-other-link .googlebuilt-in-other-link-list02{ gap: min(var(--comp-40), 60px); display: flex; justify-content: center; width: min(100%, 1080px); margin: 0 auto;}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list02 li{ width: calc(100% / 3); text-align: center;}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list02 li a{ display: inline-block; font-size: min(var(--comp-28), 18px); position: relative; padding-bottom: 3px; color: #000;}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list02 li a:hover{ text-decoration: underline;}

/*-- TRADE MARK --*/
#googlebuilt-in-trademark{ text-align: center; background: var(--darkgray); color: #fff; font-size: min(var(--comp-18), 12px); padding: min(var(--comp-30), 20px) min(var(--comp-40), 60px); line-height: 1.6;}
#googlebuilt-in-trademark span{ display: inline-block; line-height: 1.6;}

/*-- TO TOP --*/
#googlebuilt-in-container #page-top{ display:none; position:fixed; z-index: 10; right: min(var(--comp-10), 20px); bottom: min(var(--comp-120), 80px);}
#googlebuilt-in-container #page-top .totopBtn{ margin: -10px 0 0; padding:0; width: min(var(--comp-70), 60px); height: min(var(--comp-70), 60px); position: relative;}
#googlebuilt-in-container #page-top .totopBtn a{ display: block; background: var(--darkgray); height: 100%; width: 100%; border-radius: 50%; transition: all 0.5s ease, opacity 0.5s ease; text-decoration:none; display:block; cursor:pointer;}
#googlebuilt-in-container #page-top .totopBtn a::before{ content: ""; display: block; width: min(var(--comp-15), 15px); height: min(var(--comp-15), 15px); border-top: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: calc(50% - min(var(--comp-5), 5px)); left: calc(50% - min(0.9vw, 7px)); transform: rotate(-45deg);}
#googlebuilt-in-container #page-top .totopBtn a:hover{ background: var(--red);}
    
/*----------------------------------------------

TOP

----------------------------------------------*/
/*-- TOP MAIN VISUAL --*/
#googlebuilt-in-top-main{ position: relative; width: 100%;}
#googlebuilt-in-top-main .googlebuilt-in-top-main-text{ position: absolute; bottom: min(var(--comp-40), 60px); left: 0; z-index: 2; width: 100%; padding: 0 min(var(--comp-40), 60px); box-sizing: border-box;}
#googlebuilt-in-top-main .googlebuilt-in-top-main-text h1{ margin: 0 auto min(var(--comp-40), 40px); font-size: min(var(--comp-68), 68px); line-height: 1.4; color: #fff; text-align: center; font-weight: 700;}
#googlebuilt-in-top-main .googlebuilt-in-top-main-text h1 span{ display: inline-block; line-height: 1;}
#googlebuilt-in-top-main .googlebuilt-in-top-main-text p{ font-weight: 500; font-size: min(var(--comp-24), 22px); text-align: center; color: #fff; line-height: 2;}
#googlebuilt-in-top-main .googlebuilt-in-top-main-text p span{ display: inline-block; line-height: 1;}
#googlebuilt-in-top-main .googlebuilt-in-top-main-img{ position: relative; width: 100%; height: 940px; display: block; background-color: #000;}
#googlebuilt-in-top-main .googlebuilt-in-top-main-img img { max-width: none; width: clamp(840px, 150%, 1920px); position: absolute; top: 0; left: 50%; transform: translateX(-48%);}
    
  
/*-- TOP CONTENT --*/
/*Top section*/
#googlebuilt-in-container .googlebuilt-in-top-section{ width: 100%; position: relative; margin-bottom: min(var(--comp-80), 120px);}
#googlebuilt-in-container .googlebuilt-in-top-section:last-child{ margin-bottom: 0;}
#googlebuilt-in-container .wrap-googlebuilt-in-top-section01{ padding: min(var(--comp-70), 60px) min(var(--comp-40), 60px) min(calc(var(--comp-200) + var(--comp-70)), 265px); position: relative;}
#googlebuilt-in-container .wrap-googlebuilt-in-top-section01::before{ content: ""; display: block;  position: absolute; display: block; left: 0; top: 0; width: calc(50% + min(var(--comp-190), 100px)); background: #fff; height: 100%; border-radius: 0 min(var(--comp-30), 40px) 0 0; }
#googlebuilt-in-container .wrap-googlebuilt-in-top-section01 h2{ width: min( 100%, 800px); margin: 0 auto; position: relative;}
#googlebuilt-in-container .wrap-googlebuilt-in-top-section01 h2 img{ margin: 0 auto 0 0; display: block;}
#googlebuilt-in-container .wrap-googlebuilt-in-top-section01 h2.hg img{ width: min(55vw, 427px); height: auto;}
#googlebuilt-in-container .wrap-googlebuilt-in-top-section01 h2.okg img{ width: min(54vw, 380px); height: auto;}
#googlebuilt-in-container .wrap-googlebuilt-in-top-section01 h2.gm img{ width: min(52vw, 358px); height: auto;}
#googlebuilt-in-container .wrap-googlebuilt-in-top-section01 h2.gp img{ width: min(55vw, 380px); height: auto;}

#googlebuilt-in-container .wrap-googlebuilt-in-top-section02{ margin-top: max(calc((var(--comp-200) + 1px) * (-1)), -226px); position: relative; padding: 0 0 min(var(--comp-80), 100px)}
#googlebuilt-in-container .wrap-googlebuilt-in-top-section02::before{ content: ""; display: block;  position: absolute; display: block; right: 0; bottom: 0; width: calc(50% + min(50%, 540px)); background: #fff; height: calc(100% - min(var(--comp-200) , 225px)); border-radius: 0 0 0 min(var(--comp-30), 40px);}
#googlebuilt-in-container .inner-googlebuilt-in-top-section02{ width: min(90%, 800px); margin: 0 auto; position: relative;}
#googlebuilt-in-container .googlebuilt-in-top-movie-box{ margin: 0 auto min(var(--comp-60), 50px); position: relative; width: 100%; height: 100%; padding-top: 56.25%;}
#googlebuilt-in-container .googlebuilt-in-top-movie-box iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#googlebuilt-in-container .googlebuilt-in-top-movie-box video{ width: 100%; height: auto; background: #000;}
#googlebuilt-in-container .inner-googlebuilt-in-top-text-box h3{ border-bottom: 1px solid var(--lightgray); padding-bottom: min(var(--comp-30), 25px); margin: 0 auto min(var(--comp-60), 60px); font-size: min(var(--comp-36), 20px); font-weight: 700; position: relative;}
#googlebuilt-in-container .inner-googlebuilt-in-top-text-box h3::after{ content: ""; display: block; height: 1px; width: min(var(--comp-100), 100px); background: var(--red); position: absolute; bottom: -1px; left: 0;}

/*Top section- reverse*/
#googlebuilt-in-container .googlebuilt-in-top-section.even .wrap-googlebuilt-in-top-section01::before{ left: auto; right: 0; border-radius: min(var(--comp-30), 40px) 0 0 0; }
#googlebuilt-in-container .googlebuilt-in-top-section.even .wrap-googlebuilt-in-top-section01 h2 img{ margin: 0 0 0 auto;}
#googlebuilt-in-container .googlebuilt-in-top-section.even .wrap-googlebuilt-in-top-section02:before{ right: auto; left: 0; border-radius: 0 0 min(var(--comp-30), 40px) 0;}


/*-- PAGE LINK --*/
#googlebuilt-in-page-link{ background: #fff; padding: min(var(--comp-120), 120px) min(var(--comp-70), 60px);}
#googlebuilt-in-page-link .googlebuilt-in-page-link-ttl{ font-size: min(var(--comp-36), 32px); text-align: center; font-weight: 700; line-height: 1.6; margin: 0 auto min(var(--comp-55), 55px)}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list{ gap: min(var(--comp-40), 60px); display: flex; justify-content: space-between; width: min(100%, 1080px); margin: 0 auto;}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li{ width: calc(100% / 3)}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li a{ background: var(--lightgray); display: block; box-sizing: border-box; padding: min(var(--comp-60), 60px) 0 calc(min(var(--comp-20), 20px) + min(var(--comp-50) ,50px) + 75px); border-radius: min(var(--comp-20), 20px); position: relative; height: 100%;}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li .icon{ height: min(var(--comp-75), 60px); width: 100%; margin: 0 auto min(var(--comp-30), 25px);}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li .icon img{ height: 100%; width: auto; display: block; margin: 0 auto;}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li .text{ font-size: min(var(--comp-30), 20px); font-weight: 700; text-align: center; margin: 0 auto; width: 80%; line-height: 1.8;}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li .text span{ display: inline-block; line-height: 1;}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li .arrow{ width: min(var(--comp-50) ,50px); height: min(var(--comp-50) ,50px); margin: 0 auto 0; box-sizing: border-box; border-radius: 50%; background: var(--darkgray); position: absolute; bottom: min(var(--comp-20), 20px); left: calc(50% - min(var(--comp-25), 25px)); transition: background 0.5s ease;}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li .arrow::before{ content: ""; display: block; width: min(var(--comp-10), 10px); height: min(var(--comp-10), 10px); border-top: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: calc(50% - min(var(--comp-5), 5px)); left: calc(48% - min(var(--comp-5), 5px)); transform: rotate(45deg);}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li a:hover .arrow{ background: var(--red);}


/*----------------------------------------------

SECOND

----------------------------------------------*/
/*-- SECOND TITLE --*/
#googlebuilt-in-second-ttl-box{ background: url("../img/common/sec-bgtop-pc.jpg") no-repeat center center; background-size: auto 100%; background-color: #020303; height: min(37.8378378378378378378378378vw, 280px); display: flex; flex-direction: column; justify-content: center;}
#googlebuilt-in-second-ttl-box h1{ padding: 0 min(5%, 60px); width: min(100%, 1080px); margin: 0 auto; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center;}
#googlebuilt-in-second-ttl-box h1 .icon{ flex: 0 1 auto; margin-right: min(var(--comp-30), 30px);}
#googlebuilt-in-second-ttl-box h1 .icon img{ display: block; height: min(var(--comp-75), 75px);}
#googlebuilt-in-second-ttl-box h1 .text{ color: #fff; font-size: min(var(--comp-40), 40px); font-weight: 700; flex-grow: 1; line-height: 1.4; max-width: min(47vw, 530px)}

#googlebuilt-in-container .googlebuilt-in-ttl-type01{ margin: 0 auto min(var(--comp-35), 35px); position: relative; text-align: center; padding-bottom: min(var(--comp-20), 20px); font-size: min(var(--comp-32), 32px); font-weight: 700;}
#googlebuilt-in-container .googlebuilt-in-ttl-type01::after{ content: ""; display: block; width: min(var(--comp-60), 60px); height: min(0.5vw, 4px); background: var(--red); position: absolute; bottom: 0; left: calc(50% - min(var(--comp-30), 30px))}


/*----------------------------------------------

SET UP

----------------------------------------------*/
#googlebuilt-in-container .googlebuilt-in-setup-box section{ position: relative; padding: min(var(--comp-120), 120px) 0;}
#googlebuilt-in-container .googlebuilt-in-setup-box section::after{ content: ""; display: block; width: 0; height: 0; border-style: solid; border-width: min(var(--comp-40), 40px) min(var(--comp-40), 40px) 0 min(var(--comp-40), 40px); position: absolute; top: -1px; left: calc(50% - min(var(--comp-40), 40px));}
#googlebuilt-in-container .googlebuilt-in-setup-box section:first-child::after{ content: none;}
#googlebuilt-in-container .googlebuilt-in-setup-box section:nth-child(odd){ background: var(--lightgray);}
#googlebuilt-in-container .googlebuilt-in-setup-box section:nth-child(even){ background: #fff;}
#googlebuilt-in-container .googlebuilt-in-setup-box section:nth-child(odd)::after{ border-color: #fff transparent transparent transparent}
#googlebuilt-in-container .googlebuilt-in-setup-box section:nth-child(even)::after{ border-color: var(--lightgray) transparent transparent transparent; }
#googlebuilt-in-container .inner-googlebuilt-in-setup{ width: min(90%, 800px); margin: 0 auto; position: relative;}
#googlebuilt-in-container .googlebuilt-in-setup-movie-box{ margin: 0 auto min(var(--comp-60), 50px)}
#googlebuilt-in-container .inner-googlebuilt-in-setup-movie-box{ margin: 0 auto min(var(--comp-60), 50px); position: relative; width: 100%; height: 100%; padding-top: 56.25%;}
#googlebuilt-in-container .inner-googlebuilt-in-setup-movie-box iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#googlebuilt-in-container .googlebuilt-in-setup-movie-box:last-child,
#googlebuilt-in-container .inner-googlebuilt-in-setup-movie-box:last-child{ margin-bottom: 0;}
#googlebuilt-in-container .googlebuilt-in-setup-box video{ width: 100%; height: auto; background: #000;}


/*-- ANCHOR --*/
#googlebuilt-in-container .googlebuilt-in-setup-anchor-box {
    padding: min(var(--comp-50), 50px) 0;
    background: var(--lightgray);
}

#googlebuilt-in-container .googlebuilt-in-setup-anchor-caution {
    font-size: min(var(--comp-18), 12px);
    text-align: center;
    margin: min(var(--comp-30), 30px) auto 0;
	text-align: center;
    width: min(90%, 700px);
    line-height: 1.8;
}

#googlebuilt-in-container .googlebuilt-in-setup-anchor-caution span {
    display: inline-block;
    line-height: 1;
}
/*----------------------------------------------

FAQ

----------------------------------------------*/
/*-- FAQ INTRO --*/
#googlebuilt-in-container .googlebuilt-in-faq-top-intro-box{ padding: min(var(--comp-80) ,115px) 0 min(var(--comp-80), 120px); background: var(--lightgray);}
#googlebuilt-in-container .googlebuilt-in-faq-top-intro-box .intro-section{ background: #fff; margin: 0 auto; width: min(90%, 960px); box-sizing: border-box; padding: min(var(--comp-70), 40px) min(var(--comp-40), 60px); border-radius: min(var(--comp-15), 10px);}
#googlebuilt-in-container .googlebuilt-in-faq-top-intro-box .intro-section:not(:last-child){ margin-bottom: min(var(--comp-40), 40px);}
#googlebuilt-in-container .googlebuilt-in-faq-top-intro-box .intro-section .intro-ttl{ font-size: min(var(--comp-30), 20px); font-weight: 700; line-height: 1.6; margin: 0 auto min(var(--comp-25), 25px);}
#googlebuilt-in-container .googlebuilt-in-faq-top-intro-box .intro-section .intro-ttl:not(:first-child){ margin-top: min(var(--comp-60), 60px);}
#googlebuilt-in-container .googlebuilt-in-faq-top-intro-box .intro-section .intro-text{ font-weight: 500; font-size: min(var(--comp-24), 16px); line-height: 2;}
#googlebuilt-in-container .googlebuilt-in-faq-top-intro-box .intro-section .intro-list{ list-style: none; font-weight: 500; font-size: min(var(--comp-24), 16px); line-height: 2;}

/*-- FAQ CATEGORY --*/
#googlebuilt-in-container .googlebuilt-in-faq-category-box{ padding: min(var(--comp-80) ,120px) 0 min(var(--comp-80) ,120px);}
#googlebuilt-in-container .googlebuilt-in-faq-category-list{ width: min(90%, 800px); margin: 0 auto; display: flex; justify-content: flex-start; flex-wrap: wrap; row-gap: min(var(--comp-30), 50px); column-gap: calc((100% - (min(var(--comp-200), 200px) * 3) - 2px) / 2)}
#googlebuilt-in-container .googlebuilt-in-faq-category-list li{ width: min(var(--comp-200), 200px); }
#googlebuilt-in-container .googlebuilt-in-faq-category-list li a{ display: block; border: 4px solid var(--lightgray); border-radius: min(var(--comp-20), 20px); transition: background 0.5s ease;}
#googlebuilt-in-container .googlebuilt-in-faq-category-list li a:hover{ background: var(--lightgray);}

/*-- FAQ DETAIL --*/
#googlebuilt-in-container  .googlebuilt-in-faq-detail-box{ padding: min(var(--comp-80) ,115px) 0 min(var(--comp-80), 120px); background: var(--lightgray);}
#googlebuilt-in-container .googlebuilt-in-faq-detail-category-box{ margin: 0 auto 0; width: min(90%, 960px);}
#googlebuilt-in-container .googlebuilt-in-faq-detail-category-box:not(:first-child){ margin-top: min(var(--comp-80), 80px)}
#googlebuilt-in-container .googlebuilt-in-faq-detail-category-box h2{ margin: 0 auto min(var(--comp-40), 35px);}
#googlebuilt-in-container .googlebuilt-in-faq-detail-category-box h2:not(:first-child){ margin-top: min(var(--comp-80), 80px)}
#googlebuilt-in-container .googlebuilt-in-faq-detail-category-box h2 span{ display: block; background: #fff; width: min(var(--comp-120), 120px); border-radius: min(var(--comp-12), 12px); margin: 0 auto;}

#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box{ margin: 0 auto min(var(--comp-40), 30px); border-radius: min(var(--comp-15), 10px); background: #fff; overflow: hidden;}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-btn{ box-sizing: border-box; padding: min(var(--comp-60), 30px) min(var(--comp-90), 80px) min(var(--comp-60), 30px) min(var(--comp-50), 60px); position: relative; font-size: min(var(--comp-30), 20px); font-weight: 700; line-height: 1.6; cursor: pointer; transition: background 0.5s ease;}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-btn.active{ background: #fbeaea;}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-btn::after{ content: ""; display: block; width: min(var(--comp-15), 12px); height: min(var(--comp-15), 12px);  border-top: min(0.5vw, 2px) solid var(--red); border-right: min(0.5vw, 2px) solid var(--red); transform: rotate(135deg); position: absolute; right: min(var(--comp-50), 40px); top: calc(50% - min(var(--comp-10), 6px)); transition: transform 0.5s ease;}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-btn.active::after{ transform: rotate(-45deg); top: calc(50% - min(var(--comp-10), 6px));}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-box{ box-sizing: border-box; padding: min(var(--comp-60), 30px) min(var(--comp-50), 50px) min(var(--comp-60), 30px) min(var(--comp-50), 60px); font-weight: 500; font-size: min(var(--comp-24), 16px); line-height: 2; display: none;}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-box .text{ margin: min(var(--comp-30), 20px) auto min(var(--comp-30), 20px); font-weight: 500; font-size: min(var(--comp-24), 16px); line-height: 2;}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-box .boxFaq{ margin: min(var(--comp-40), 30px) auto min(var(--comp-40), 30px); font-weight: 500; font-size: min(var(--comp-24), 16px); line-height: 2;}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-box .ttl{ margin: 0 auto min(var(--comp-15), 10px); font-size: min(var(--comp-26), 18px); font-weight: 700}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-box .ttl + .text{ margin-top: 0;}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-box .googlebuilt-in-list-type01{ margin: 0;}
#googlebuilt-in-container .googlebuilt-in-faq-detail-accordion-box .faq-detail-accordion-box .googlebuilt-in-list-type01 li{ font-weight: 500;}

#googlebuilt-in-container .faq-top-button{ margin: 0 auto; }
#googlebuilt-in-container .faq-top-button a{ width: min(var(--comp-200), 140px); display: block; position: relative; margin: 0 0 0 auto; background: var(--darkgray); color: #fff; font-weight: 700; font-size: min(var(--comp-24), 16px); text-align: right; padding: min(var(--comp-15), 11px) min(var(--comp-30), 20px) min(var(--comp-15), 11px) 0; line-height: 1.6; border-radius: min(var(--comp-12), 8px); transition: background 0.5s ease;}
#googlebuilt-in-container .faq-top-button a::after{ content: ""; display: block; width: min(var(--comp-15), 12px); height: min(var(--comp-15), 12px); border-top: min(0.5vw, 2px) solid #fff; border-left: min(0.5vw, 2px) solid #fff; position: absolute; transform: rotate(-45deg); left: min(var(--comp-30), 20px); top: calc(50% - min(var(--comp-5), 6px))}
#googlebuilt-in-container .faq-top-button a:hover{ background: var(--red);}



/*----------------------------------------------

OTHER

----------------------------------------------*/
.bold{ font-weight: 700 !important;}

/*Text*/
#googlebuilt-in-container .googlebuilt-in-catch{ font-size: min(var(--comp-36), 32px); margin: 0 auto min(var(--comp-60), 100px); line-height: 2; font-weight: 700; text-align: center; box-sizing: border-box; padding: 0 5%;}
#googlebuilt-in-container .googlebuilt-in-catch span{ display: inline-block; line-height: 1;}
#googlebuilt-in-container .googlebuilt-in-text{ margin: min(var(--comp-50), 50px) auto; font-size: min(var(--comp-24), 16px); line-height: 2; font-weight: 400;}
#googlebuilt-in-container .googlebuilt-in-text:last-child{ margin-bottom: 0;}

/*List*/
#googlebuilt-in-container .googlebuilt-in-list-type01{ margin: min(var(--comp-50), 50px) auto;}
#googlebuilt-in-container .googlebuilt-in-list-type01:last-child{ margin-bottom: 0;}
#googlebuilt-in-container .googlebuilt-in-list-type01 li{ padding-left: 1.3em; position: relative; font-size: min(var(--comp-24), 16px); line-height: 2; font-weight: 400; margin: 0 auto 10px;}
#googlebuilt-in-container .googlebuilt-in-list-type01 li:last-child{ margin-bottom: 0;}
#googlebuilt-in-container .googlebuilt-in-list-type01 li::before{ content: ""; display: block; width: 10px; height: 10px; background: #696969; border-radius: 50%; position: absolute; left: 0; top: calc(1em - 6px);}

/*Button*/
#googlebuilt-in-container .googlebuilt-in-btn-type01{ margin: min(var(--comp-50), 50px) auto;}
#googlebuilt-in-container .googlebuilt-in-btn-type01:last-child{ margin-bottom: 0;}
#googlebuilt-in-container .googlebuilt-in-btn-type01 a{ display: inline-block; min-width: min( 52.7027027027027027027vw, 260px); background: var(--darkgray); color: #fff; text-align: center; font-size: min(var(--comp-27),18px); padding: min(var(--comp-30), 20px) min(var(--comp-50), 40px); border-radius: 50px; position: relative; transition: background 0.5s ease; }
#googlebuilt-in-container .googlebuilt-in-btn-type01 a::after{ content: ""; display: block; border-top: 2px solid #fff; border-right: 2px solid #fff; width: min(var(--comp-20), 12px); height: min(var(--comp-20), 12px); position: absolute; right: min(var(--comp-25), 20px); top: calc(50% - min(var(--comp-10), 6px)); transform: rotate(45deg);}
#googlebuilt-in-container .googlebuilt-in-btn-type01 a:hover{ background: var(--red);}

/*Animation*/
#googlebuilt-in-container .fadein{ opacity : 0; transition : opacity 1s ease, transform 1s ease; transform: translateY(-10px)}
#googlebuilt-in-container .fadein.scrollin { opacity : 1; transform: translateY(0)}



@media screen and (max-width: 980px){
    
/*----------------------------------------------

TOP

----------------------------------------------*/
/*-- PAGE LINK --*/
#googlebuilt-in-page-link .googlebuilt-in-page-link-list{ flex-wrap: wrap;}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li{ width: 100%;}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li a{ padding: min(var(--comp-60), 60px) 0 min(var(--comp-60), 60px); }
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li .text{ margin: 0 auto; width: 100%; padding: 0 calc(min(var(--comp-50) ,50px) + 5%) 0 calc(min(var(--comp-50) ,50px) + 5%); box-sizing: border-box;}
#googlebuilt-in-page-link .googlebuilt-in-page-link-list li .arrow{ margin: 0; position: absolute; top: calc(50% - min(var(--comp-25) ,25px)); left: auto; right: min(var(--comp-20), 30px)}
    
/*----------------------------------------------

SECOND

----------------------------------------------*/
#googlebuilt-in-second-ttl-box{ background: url("../img/common/sec-bgtop-sp.jpg") no-repeat right center; background-size: auto 100%; background-color: #020303; }
    
/*----------------------------------------------

OTHER

----------------------------------------------*/
/*-- OTHER LINK --*/
#googlebuilt-in-other-link .googlebuilt-in-other-link-list01{ flex-wrap: wrap;}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list01 li{ width: 100%; }
#googlebuilt-in-other-link .googlebuilt-in-other-link-list02{ flex-wrap: wrap;}
#googlebuilt-in-other-link .googlebuilt-in-other-link-list02 li{ width: 100%; }
}


@media screen and (min-width: 768.000000000001px){
.sp{ display: none !important;}
    
}
    


@media screen and (max-width: 768px){
    
.pc{ display: none !important;}
    
/*----------------------------------------------

COMMON

----------------------------------------------*/
/*-- navi --*/
/*hamburger*/
#googlebuilt-in-hamburger{ top: 0; right: 0; }
#googlebuilt-in-hamburger.fixed{ position: fixed; top: 0; right: 0;}
    
/*navi content*/
#googlebuilt-in-navi{ max-width: 100%; }
    
/*-- TOP MAIN VISUAL --*/
#googlebuilt-in-top-main .googlebuilt-in-top-main-img{ position: relative; width: 100%; height: auto; display: block;}
#googlebuilt-in-top-main .googlebuilt-in-top-main-img img { position: relative; top: auto; left: auto; transform: translateX(0); width: 100%; height: auto; object-fit: contain;}

}
